+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: Początkujący webmaster (https://www.webmastertalk.pl/forum-poczatkujacy-webmaster)
+--- Wątek: [HTML][CSS]Wyśrodkowanie strony (/thread-html-css-wy%C5%9Brodkowanie-strony)
Strony:
1
2
[HTML][CSS]Wyśrodkowanie strony - misio - 22-03-2012
Witam, mam pewien problem z wyśrodkowaniem strony. Po dodaniu margin: 0 auto; tylko połowę strony wyśrodkowuje się, a reszta zostaje po lewej stronie.
Kod:
body {
background:white;
width: 900px;
height: auto;
font-family:"Times New Roman", Times, serif;
padding: 0px;
font-size: 14pt;
color:white;
}
a:link {
color: white;
text-decoration:none;
}
a:visited {
color: white;
text-decoration:none;
}
a:hover {
color: white;
text-decoration:none;
}
ul li {
display: block;
list-style: none;
margin: 0;
padding: 0;
float: left;
}
ul {
position: absolute;
}
/* ############# Nagłówek ############# */
div#naglowek {
background-color:#222222 ;
width: 900px;
height: 50px;
}
div.menu {
width: 900px;
height: 50px;
margin-left: 75px;
margin-right: 75px;
}
div.menu li {
padding-left: 10px;
}
/* ############# Top ############# */
div#top {
background-image:url('../grafika/tlo_ciemne.jpg');
width: 900px;
height: 110px;
}
div.lewy_top {
width: 75px;
height: 309px;
background-image: url('../grafika/lewy_top.jpg');
float:left;
}
div.prawy_top {
width: 75px;
height: 309px;
background-image: url('../grafika/lewy_top.jpg');
float:left;
}
div.srodkowy_top {
width: 750px;
height: 286px;
background-image: url('../grafika/obraz_top.jpg');
float:left;
}
/* ############# Belka pod głownym obrazem ############# */
div.lewy_przycisk {
position: absolute;
top: 454px;
left: 83px;
width: 22px;
height:23px;
background-image: url('../grafika/lewy_przycisk.jpg') ;
background-repeat:no-repeat;
}
div.prawy_przycisk {
position: absolute;
top: 454px;
left: 810px;
width: 23px;
height:23px;
background-image: url('../grafika/prawy_przycisk.jpg') ;
background-repeat:no-repeat;
}
div.belka {
position: absolute;
top: 454px;
left: 105px;
width: 705px;
height: 23px;
background-color: #DE0000;
}
/* ############# Główna część strony ############# */
div#content {
position: absolute;
top: 477px;
left: 8px;
width: 900px;
height: 641px;
background-image: url('../grafika/content.jpg');
}
div.pierwsza_kolumna {
position: absolute;
background-image:url('../grafika/content.jpg');
top: 40px;
left: 75px;
width: 164px;
height: 177px;
z-index:auto;
}Myślę że ktoś na pewno mi pomoże.
Pozdrawiam
RE: [HTML][CSS]Wyśrodkowanie strony - hieroshima - 22-03-2012
a gdzie dodałeś to margin: 0 auto ?
RE: [HTML][CSS]Wyśrodkowanie strony - Pedro84 - 22-03-2012
Strukturę HTML jeszcze pokaż...
RE: [HTML][CSS]Wyśrodkowanie strony - misio - 22-03-2012
To jest struktura html:
Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="pl" http-equiv="Content-Language" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Untitled 1</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="calosc">
<div id="naglowek">
<div class="menu">
<ul>
<li><a href="#">HOME</a></li>
<li><a href="#">ABOUT</a></li>
<li><a href="#">FEATURES</a></li>
<li><a href="#">SHORTCODES</a></li>
<li><a href="#">BLOG</a></li>
<li><a href="#">CONTACT</a></li>
</ul>
</div>
</div>
<div id="top"></div>
<div id="top2">
<div class="lewy_top"></div>
<div class="srodkowy_top"></div>
<div class="lewy_przycisk"></div>
<div class="belka"></div>
<div class="prawy_przycisk"></div>
<div class="prawy_top"></div>
</div>
<div id="content">
<div class="pierwsza_kolumna">
<h3>Tytuł</h3>
<p>Lorem</p>
</div>
</div>
</div>
</body>
</html>Cytat:a gdzie dodałeś to margin: 0 auto ?
Dodałem do body { ... } na samym końcu. Tutaj akurat nie mam, bo chciałem pokazać kod z przed próby wyśrodkowania.
RE: [HTML][CSS]Wyśrodkowanie strony - Pedro84 - 22-03-2012
Do kontenera to daj, a nie do body.
RE: [HTML][CSS]Wyśrodkowanie strony - hieroshima - 22-03-2012
to nic nie zmieni. Za dużo pozycjonowania absolutnego prawie każdy div ma pozycje absolutną i w każdym jest wartość top i left więc jak on ma środkować jak każdy element ma swoje wartości left i top.
RE: [HTML][CSS]Wyśrodkowanie strony - hieroshima - 22-03-2012
lepiej zmień ten kod i nie pozycjonuj bezwzględnie bo będzie się sypać
RE: [HTML][CSS]Wyśrodkowanie strony - misio - 22-03-2012
Dzięki za pomoc, niestety nawet po wprowadzeniu tego ostatniego kodu nic nie pykło.
Mam pozycjonowanie absolutne przez jeden głupi element, a dokładnie mówiąc przez pewną belkę. Nie umiałem jej w inny sposób wypozycjonować więc poszedłem na łatwiznę a teraz będę poprawiał cały kod.
RE: [HTML][CSS]Wyśrodkowanie strony - TastemanPL - 23-03-2012
Hmm. rozumiem cię też chciałem kiedyś wyśrodkować stronę zrobiłem to <center> po <html> i </center> przed </html>.Mi pomogło
RE: [HTML][CSS]Wyśrodkowanie strony - hieroshima - 23-03-2012
<center> jest niezgodne ze standardami