Chcę "zcentralizować" tekst i zawartość mojej strony. Teraz nie chcę wyrównywać tekstu do środka, nadal chcę wyrównania do lewej strony, ale chcę mieć znaczące marginesy po lewej i prawej stronie, aby wszystko wyglądało stosunkowo centralnie. Czy możesz pokazać mi HTML/CSS, aby to osiągnąć? Dzięki.Zawartość centrum strony
#wrapper {
width: 800px;
margin: 0 auto;
}
<div id="wrapper">
<p>This will appear in a centered container</p>
</div>
Wierzę, że this może ci pomóc.
CSS:
#container {
max-width: 800px;
margin: 0 auto;
}
I w HTML, zawinąć wszystko:
<div id='container'>
...
</div>
(Zauważ, że ta odpowiedź różni się od Meep w które używam max-width dać układ płynu poniżej 800 pikseli, podczas gdy on używa width, aby nadać mu stały układ.)
... Z wyjątkiem większości wersji IE nie wiem, co to jest "maksymalna szerokość". –
IE7 i powyżej zrobić. Dla IE6, oto doskonały artykuł na temat tego, jak osiągnąć to samo: http://javascript.about.com/library/blwidth.htm – RichieHindle
Utwórz 3 kolumny na swojej stronie. Cały tekst jest umieszczany w środkowej kolumnie i można go pozostawić alligned.
Sprawdźcie tutaj na przykładach http://matthewjamestaylor.com/blog/perfect-3-column.htm
spróbować
#div {
margin:0 auto
};
<html>
<head>
<style type="text/css">
body {
text-align: center; /* Center in IE */
}
#content {
text-align: left; /* reset text-align for IE */
margin: 0 auto; /* Center in other browsers */
width: 800px;
}
html {
overflow: -moz-scrollbars-vertical; /* Force vertical scrollbar in FF */
}
</head>
<body>
<div id="content">
content here
</div>
</body>
</html>
* UPDATE: dodałam trochę CSS, który powoduje pionowy pasek przewijania w FF, jak na niektórych komentarzach poniżej.
Lepiej jest umieścić wyrównanie tekstu: centrum; na innym zawierającym div, jeśli używasz edytora WYSIWYG, który wyśrodkuje cały twój tekst w edytorze. –
+1, ponieważ zgadzam się - podałem najprostszy przykład, jaki mogłem dla pytającego, ale w rzeczywistości robiłbym dokładnie to, co sugerujesz. –
To działa dobrze, ale jest niewielki problem. Zastosowałem to na wszystkich moich stronach i wydaje mi się, że na niektórych stronach przesuwają się one nieznacznie w lewo/w prawo. To rozprasza, gdy mój pasek menu przesuwa się z jednej strony na drugą. – alamodey
Czy div kontenera, w którym można umieścić wszystkie treści:
<html>
<head>
<title>a sample</title>
</head>
<body>
<div id="container">
<h1>this is it</h1>
<p>all content goes here</p>
</div>
</body>
następnie dodać trochę css określając szerokość i marże swojego div kontenera:
#container {
width: 750px;
margin: 0 auto;
}
w niektórych przeglądarkach, takich jak IE dla przykład, to nie zadziała. Będziesz musiał dodać inny element owijający div #wrapper, który ustawia wyrównanie tekstu na środek. W #wrapper powinieneś ustawić wyrównanie tekstu na lewo. –
Nigdy nie doświadczyłem tego problemu? Użyłem tego kawałka kodu na każdej stronie, którą zrobiłem. Z dokumentem XHTML. Jeśli widzisz: http://dev.korebogen.dk - jest on wyśrodkowany we wszystkich przeglądarkach. A CSS ma tylko #wrapper {width: 960px; margin: 0 auto; } – janhartmann
W porządku - może to nie będzie centrum w IE5 - ale do diabła, kto i tak to robi? :-) – janhartmann