Jak wyśrodkować ciało na stronie?

Próbuję wyśrodkować element body na mojej stronie HTML.Jak wyśrodkować ciało na stronie?

enter image description here

Zasadniczo w CSS ustawić element ciała, aby być display: inline-block; tak, że jest tylko tak szeroki jak jego zawartość. To działa dobrze. Jednak margin: 0px auto; nie wyśrodkowuje go na stronie.

Czy ktoś wie, jak to naprawić? Chcę, aby duży niebieski kwadrat był wycentrowany na stronie, a nie pływający po lewej, tak jak teraz.

Oto mój CSS:

body { 
    display: inline-block; 
    margin: 0px auto; 
    text-align: center; 
}

Źródło

2012-06-03 Ryan Peschel

Czy te inne pudełka nie powinny znajdować się w ciele? – barro32

Sugerowałbym _nie_ aby scentralizować 'ciało', w rzeczywistości, uczyniłem wyśrodkowany' div' – Asif

, nigdy nie powinieneś wyśrodkować ciała. spójrz na freecsstemplates.com --- będziesz projektant zawsze używał divy – Yang

zastosować także text-align: center; na elemencie html tak:

html { 
    text-align: center; 
}

Lepszym rozwiązaniem jest jednak, aby mieć wewnętrzną div kontenera, który będzie centralnym, a nie ciała.

Źródło

2012-06-03 18:16:13

To jest dokładnie to, o co się prosiliśmy, dlaczego jest poddawany pod głosowanie? http://jsfiddle.net/gA9La/2/ – barro32

To działa idealnie. Dzięki. –

Edytowałem swoją odpowiedź. Zobacz lepsze podejście. –

Musisz określić szerokość ciała, aby znalazł się na środku strony.

Or put all the content in the div and center it.

<body> 
    <div> 
    jhfgdfjh 
    </div> 
</body> 

div { 
    margin: 0px auto; 
    width:400px; 
}

Źródło

2012-06-03 18:16:48 SRN

Hmm .. Pomyślałem, że to możliwe, ale .. co, jeśli nie znam rozmiaru z góry? –

Następnie użyj wartości procentowej –

Próbowałem ustawić szerokość i używając wartości procentowej, ale żadne z nich nie było wyśrodkowane. –

body 
    { 
     width:80%; 
     margin-left:auto; 
     margin-right:auto; 
    }

To będzie działać na większości przeglądarek, w tym Internet Explorer.

Źródło

2012-09-20 23:38:21 Freakishly

Tak, podoba mi się to. Nie chciałem, aby ciało miało stałą szerokość. –

Dla tych, którzy zrobić znać szerokość, można zrobić coś jak

div { 
    max-width: ???px; //px,% 
    margin-left:auto; 
    margin-right:auto; 
}

Zgadzam się również o nie ustawienie text-align: center na ciele, ponieważ może zepsuć resztę Twój kod i być może będziesz musiał ustawić indywidualnie tekst wyrównanie tekstu: po lewej stronie na wiele rzeczy, albo wtedy, albo w przyszłości.

Źródło

2015-05-26 20:04:20 DardanM

Jak wyśrodkować ciało na stronie?

Odpowiedz

Powiązane problemy