Próbuję wyśrodkować newsslider (w dolnym pojemniku div) na tej stronie:Centrum div w CSS
http://www.luukratief-design.nl/dump/parallax/index.html
mam już text-align: center;
Nadal nie działa .
Wszelkie sugestie?
text-align: center; Centra tylko element za zawartość inline, a nie sam element.
Jeśli jest to block element (a div jest), musisz ustawić margin: 0 auto;, w przeciwnym razie jest to inline element, trzeba ustawić text-align: center; na jego rodzic elementu zamiast.
Ustawi ona margin: 0 auto; górny i dolny margines na 0 oraz lewy i prawy margines na auto (tego samego rozmiaru), aby automagicznie umieścić się w środku. Działa to tylko wtedy, gdy dany element blokowy ma znaną width (stałą lub względną), w przeciwnym razie nie może określić, od czego zacząć i zakończyć.
i być może będziesz musiał podać "div" również jawną szerokość. –
Tak, rzeczywiście musisz podać element blokowy również w jawnej szerokości, ja go edytowałem. – BalusC
IIRC, niektóre starsze wersje IE nie rozpoznają wartości 'auto' marginesu, ale * będą * (błędnie) używają' text ' -align' na elementy bloku centralnego, więc używaj obu, jeśli możesz. –
dodać
margin:auto;
Spróbuj dodać to do stylu.
margin-left: auto;
Utwórz tabelę z jednym rzędzie i trzech kolumnach, ustaw lewy i prawy szerokości do 100% i voila, środkowy zostaje skupione automatycznie
To jest poprawna odpowiedź. Niepraktyczne w większości scenariuszy, tak. JEDNAK, nadal ważna. Proszę przestać przyjmować poprawną odpowiedź tylko dlatego, że "masz na to ochotę". –
text-align nie powinny być wykorzystywane do centrum element blokowy . (z wyjątkiem IE6, ale to jest bug) Musisz naprawić szerokość bloku, a następnie użyj marginesu: 0 auto;
#block
{
width: 200px;
border: 1px solid red;
margin: 0 auto;
}
i
<div id="#block">Some text... Lorem ipsum</div>
Spróbuj tego:
#bottombox {
background:transparent url(../images/bg-bottombox.png) no-repeat scroll 0 0;
float:none;
height:137px;
margin:0 auto;
padding-top:14px;
width:296px;
}
To powinno wyśrodkować div w stopce.
Jednym ze sposobów:
<div align="center">you content</div>
Lepszy sposób:
<div id="myDiv">you content</div>
CSS dla myDiv:
#myDiv{
margin:0px auto;
}
Zawsze używam
<div align="center">Some contents......</div>
Potwierdzam, że działa to z przeglądarkami Firefox (v54), Chrome (v58) i Safari (v10). –
Zastosowanie text-align: center do pojemnika, display: inline-block dla div otoki i display: inline do zawartości div poziomo Content Center, która ma niezdefiniowanej rozwartość przeglądarek:
<!doctype html>
<html lang="en">
<head>
<style type="text/css">
/* Use inline-block for the wrapper */
.wrapper { display: inline-block; }
.content { display:inline; }
.container { text-align:center; }
/*Media query for IE7 and under*/
@media,
{
.wrapper { display:inline; }
}
</style>
<title>Horizontal Centering Test</title>
</head>
<body>
<div class="container">
<div class="content">
<div class="wrapper">
test text
</div>
</div>
</div>
</body>
</html>
Pod szerokość jest ustawiony, a ty umieścić odpowiedni DOCTYPE,
Spróbuj tego:
Margin-left: auto;
Margin-right: auto;
nadzieję, że to Hel ps
Głosuję, aby zamknąć to pytanie jako niezwiązane z tematem, ponieważ pytanie i link linku są martwe! –