| Autor | Zpráva | ||
|---|---|---|---|
| kejtos Profil * |
Dobrý den, mám problém s centrováním obsahu, vím, že se to tu rozebíralo mnohokrát, snažil jsem se to dělat podle různých návodů, ovšem stále to někde pokulhává.
HTML: <body style="background: url(background.jpg) fixed black no-repeat">
<div id="wrapper">
<div id="obalovaci">
<div id="hlavicka" class="prusvitny">
</div>
<div id ="pravy" class="prusvitny">
</div>
<div id="menu" class="prusvitny">
<ul>
<li><a href="#">Strana1</a></li>
<li><a href="#">Strana2</a></li>
<li><a href="#">Strana3</a></li>
<li><a href="#">Strana4</a></li>
<li><a href="#">Strana5</a></li>
<li><a href="#">Strana6</a></li>
</ul>
<div class="cistic">
</div>
</div>
<div id="obsah" class="prusvitny">
</div>
</div>
</div>
</div>
</body>
CSS:
[precss]p {color: white}
span a {text-decoration: none}
span a:link {color: blue}
span a:visited {color: navy}
span a:active {color: black}
span a:hover {color: red; text-decoration: underline}
a {text-decoration: none}
#wrapper { margin: 0 auto 0 auto; width: 900px; text-align: left;}
#obalovaci {float: left; margin: 0 auto 0 auto; padding: 0; width: 950px; position: relative}
#obsah {position: absolute; float: right; width: 730px; top: 240px; min-height: 600px; background-color: black; border: 2px solid #B64E1F; padding: 5px; border-radius: 15px; -moz-border-radius: 15px}
#hlavicka {position: absolute; width: 950px; height: 150px; top: 3px; background-color: black; border: 2px solid #B64E1F; border-radius: 15px; -moz-border-radius: 15px}
#menu {position: absolute; width: 950px; height: 60px; top: 160px; background-color: black; border: 2px solid #B64E1F; border-radius: 15px; -moz-border-radius: 15px;}
#pravy {position: relative; width: 180px; left: 760; top: 240px; min-height: 600px; background-color: black; border: 2px solid #B64E1F; padding: 5px; border-radius: 15px; -moz-border-radius: 15px}
.prusvitny {
filter: alpha(opacity=95); /*MSIE*/
-moz-opacity: 0.95; /*GECKO*/
-khtml-opacity: 0.95; /*Konqueror, Safari*/
opacity: 0.95; /*CSS3 vůbec nevím, jestli to něco podporuje*/
}
ul {
width: 1000px;
margin: 0;
padding: 0;
}
ul li {
float: left;
list-style: none;
height: 60px;
line-height: 60px;
}
ul a {
display: block;
width: 125px;
height: 100%;
text-align: center;
font-size: 1.1em;
font-family: verdana, arial, sans-serif;
font-weight: bold;
text-decoration: none;
color: #B64E1F;
border-radius: 13px;
-moz-border-radius: 13px;
}
ul a:hover, ul a:active, ul a:focus {
color: #B64E1F;
background-color: #2D2D2D
}
.cistic {
clear: both;
height: 1px;
overflow: hidden;
margin-top: -1px;
}sice k centrování dojde, ovšem ujíždí to mírně do prava. Děkuji, kejtos |
||
| Martin02 Profil |
#2 · Zasláno: 27. 10. 2011, 19:24:15
Nevím k čemu tam máš prvek wrapper? Když ho smažeš a prvku obalovaci vymažeš float: left;, bude to zarovnané na středu.
|
||
| jenikkozak Profil |
#3 · Zasláno: 27. 10. 2011, 19:49:43
kejtos:
Když už jsem si vytvořil osobní živou ukázku, poskytnu malou radu: doplň si jednotky na označeném řádku, ať případně můžeš použít standardní režim vykreslování: #pravy {position: relative; width: 180px; left: 760px; |
||
| kejtos Profil * |
#4 · Zasláno: 27. 10. 2011, 20:27:49
|
||
|
Časová prodleva: 12 let
|
|||
0