Autor Zpráva
jrw
Profil
#1 · Zasláno: 28. 6. 2007, 17:35:04
Odpovědět Citovat
Mám jeden relativně pozicovaný box který obsahuje další čtyři boxy, tři plovoucí a čtvrtý který je až na konci za těma třema je absolutně pozicovaný. Problém je takový že když nastavím tomu poslednímu boxu top: -50px tak aby se zobrazoval nad tím rodičovským relativně pozicovaným boxem tak to funguje jen v případě že ty předchozí tři boxy nejsou plovoucí, jakmile jim přiřadím float: left tak ten absolutně pozicovaný zmizí. Nevíte čím by to mohlo být?

Díky


Vypadá to asi takto:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">
<style>
/* <![CDATA[ */
body {
text-align: center;
}
#kontejner {
text-align: left;
margin: 100px auto 0 auto;
width: 760px; height: 900px;
background-color: Silver;
position: relative;
}
#blok_1, #blok_2, #blok_3 {
height: 300px; width: 253px;
float: left;
}
#navigace {
position: absolute;
top: -50px;
width: 760px; height: 40px;
}
/* ]]> */
</style>
<title></title>
</head>
<body>

<div id="kontejner">

<div id="blok_1">
<p>Lorem ipsum dolor sit amet consectetuer nulla convallis tincidunt Phasellus et. Nisl enim orci et non dui pretium In dapibus Maecenas urna. Nibh Vestibulum Nulla orci hac euismod et Pellentesque ut cursus semper. Curabitur et vitae purus ac consequat semper eu ante eget Proin. Malesuada eget neque quis consequat sit quis Sed.</p>
</div>

<div id="blok_2">
<p>Lorem ipsum dolor sit amet consectetuer auctor interdum Integer pretium tempor. Enim sagittis sit laoreet lacus nibh lacinia nulla parturient Maecenas tincidunt. Eget consequat parturient et habitant fames convallis fringilla amet leo augue. Consequat pellentesque nibh lacinia sed felis ligula mauris purus tellus massa. Consectetuer lacus tristique lacus Quisque purus dignissim pulvinar pellentesque.</p>
</div>

<div id="blok_3">
<p>Lorem ipsum dolor sit amet consectetuer Nulla Curabitur feugiat nec eleifend. Neque sit pellentesque convallis elit dui elit vitae Nam et nonummy. Nunc malesuada ut tempor pretium nibh Vestibulum risus ligula faucibus suscipit. Metus Vivamus volutpat gravida rutrum rhoncus lorem hendrerit in laoreet sed. Non tellus Quisque Cum Nulla semper habitasse tortor in cursus vitae. Facilisis orci tincidunt pretium nibh nec Aenean eget velit lacinia In. Quis eleifend euismod.</p>
</div>

<div id="navigace">
<ul>
<li>cosi</li>
<li>cosi</li>
<li>cosi</li>
</ul>
</div>

</div>

</body>
</html>
Časová prodleva: 4 dny
Knopi
Profil
#2 · Zasláno: 2. 7. 2007, 10:13:00 · Upravil/a: Knopi
Odpovědět Citovat
jrw: Dej tam matrjošku a bude to v pohodě. Jeden div navíc nikoho nezabije. :o)

Po úpravě:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">
<style>
/* <![CDATA[ */
body {
text-align: center;
}
#kontejner {
text-align: left;
margin: 100px auto 0 auto;
width: 760px; height: 900px;
background-color: Silver;
position: relative;
}
#blok_1, #blok_2, #blok_3 {
height: 300px; width: 253px;
float: left;
}
#navigace {
position: absolute;
top: -50px;
width: 760px; height: 40px;
}
#wrap {
width: 100%; /* matrjoska */
}
/* ]]> */
</style>
<title></title>
</head>
<body>

<div id="kontejner">

<div id="wrap"> <!-- matrjoska -->
<div id="blok_1">
<p>Lorem ipsum dolor sit amet consectetuer nulla convallis tincidunt Phasellus et. Nisl enim orci et non dui pretium In dapibus Maecenas urna. Nibh Vestibulum Nulla orci hac euismod et Pellentesque ut cursus semper. Curabitur et vitae purus ac consequat semper eu ante eget Proin. Malesuada eget neque quis consequat sit quis Sed.</p>
</div>

<div id="blok_2">
<p>Lorem ipsum dolor sit amet consectetuer auctor interdum Integer pretium tempor. Enim sagittis sit laoreet lacus nibh lacinia nulla parturient Maecenas tincidunt. Eget consequat parturient et habitant fames convallis fringilla amet leo augue. Consequat pellentesque nibh lacinia sed felis ligula mauris purus tellus massa. Consectetuer lacus tristique lacus Quisque purus dignissim pulvinar pellentesque.</p>
</div>

<div id="blok_3">
<p>Lorem ipsum dolor sit amet consectetuer Nulla Curabitur feugiat nec eleifend. Neque sit pellentesque convallis elit dui elit vitae Nam et nonummy. Nunc malesuada ut tempor pretium nibh Vestibulum risus ligula faucibus suscipit. Metus Vivamus volutpat gravida rutrum rhoncus lorem hendrerit in laoreet sed. Non tellus Quisque Cum Nulla semper habitasse tortor in cursus vitae. Facilisis orci tincidunt pretium nibh nec Aenean eget velit lacinia In. Quis eleifend euismod.</p>
</div>
</div><!-- matrjoska -->

<div id="navigace">
<ul>
<li>cosi</li>
<li>cosi</li>
<li>cosi</li>
</ul>
</div>

</div>

</body>
</html>
Časová prodleva: 17 let

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0