0
135
ViewsDiv no se puede alinear al centro
Problema
Cuando trato de usar el código ( ver más abajo ), el div solo está centrado cuando uso width: 100px; .
<div style="border: solid 1px black; width: 100px; height: 100px; background-color: blue; margin-left: auto; margin-right: auto;"> 
Como quiero asignar un ancho mucho más largo al texto y establecer el ancho en 500px , el div ya no está centrado.
<div style="border: solid 1px black; width: 500px; height: 100px; background-color: blue; margin-left: auto; margin-right: auto;">Problema #2
El svg no está centrado.
<div class="col-xl-3 col-lg-3 col-sm-6"> <div class="ud-single-feature wow fadeInUp" data-wow-delay=".25s" > <div class="ud-feature-icon" > <i class="lni lni-layers"></i> </div> <div class="ud-feature-content" style="position:absolute; width: 100%; text-align: center;"> <h3 class="ud-feature-title" style="text-align: center;">test</h3> <p class="ud-feature-desc" style="text-align: center;"> test </p> <!-- <a href="javascript:void(0)" class="ud-feature-link"> Learn More </a>--> </div> </div> </div>
·
Juan Pablo Isaza
2 answers
Answer question0
Aunque su pregunta no define su objetivo deseado, usar el margen izquierdo o derecho no justificará el punto central de la página. En su lugar, considere usar position: fixed para centrar exactamente en la página.
Esto también debería significar que puede establecer las dimensiones del div como desee.
<div style="background: blue; width: 100px; height: 100px; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%)">Div should be properly centred in page.</div>
·
Juan Pablo Isaza
Report
0
Puede configurar el div como hijo de otro div así:
<div style="justify-content: center; align-items: center; display: flex;"> <div style="border: 1px solid black; width: 500px; height: 100px; background-color: blue;"> </div> </div>
·
Juan Pablo Isaza
Report
Answer question