Autor Zpráva
hellboy
Profil *
Dobry den, mam problem. Potreboval bych, aby od sebe dva dloupce dedili height. V zavislosti na tom, jak moc je "natazeny" pvni div(natahuje se podle vlozeneho textu). Mel jsem napad, kterym jsem si myslel, ze tento problem vyresim, ale nestalo se tak a ja nevim, kde je chyba.
hellboy
Profil *
Zase sem zapomnel na zdrojaky: CSS:
* {
margin: 0;
padding: 0;
border: 0;
}

.bracha {
width:100px;
float: left;
height: inherit;
background-color: red;
}

.tata {
width:200px;
float: left;
height: 100%;
background-color: blue;
}

.mama {
position: relative;
top: 200px;
left: 300px;
height: auto;
}


HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<meta name="description" content="Place your page description here.">
<meta name="keywords" content="put,your,key words,phrases,here">
<title>Inherit</title>
<link rel="stylesheet" href="style2.css" type="text/css">
</head>
<body>
<div class="mama">
<div class="tata"><p>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</p>
</div>
<div class="bracha">
</div>
</div>
</body>
</html>
Str4wberry
Profil
Odpovídám hellboy:
http://www.google.com/search?rls=cs&q=sloupce+stejn%C4%9B+vysok%C3%A9
hellboy
Profil *
Dobry mno, to me taky napadlo, ale rikal jsem si, ze to je prasana....
Bubák
Profil
ale rikal jsem si, ze to je prasana...
Použití vyhledávače není prasárna.
Asi máš na mysli první odkaz:
Dlouhý Web » 3 stejně vysoké sloupce? Tabulky jsou vhodnější

Raději koukni na:
http://teststranek.kvalitne.cz/vyska-sloupcu1/
www.wellstyled.com/css-2col-fluid-layout.html
hellboy
Profil *
Ne, ja myslel pouziti toho obrazku na pozadi, ze je prasarna.
Kazdopadne jsem to tak udelal a nechce mi to bezet ve FF ani v Opere, coz je vyjimecny, jen v IE.
Kody: CSS:
* {
  margin: 0;
  padding: 0;
  border: 0;
}

body, html {
background-color: #0A4C12;
}

body, html a {
text-decoration: none;
}

.wrapping {
width: 747px;
margin: 20px auto 0 auto;
}

.shadow_left {
height: 547px;
width: 9px;
background: url('shadow_left_2.png') repeat-y;
float: left;
}

.logo {
width: 254px;
height: 195px;
background: url('logo.png') no-repeat;
float: left;
}

.logo2 {
width: 493px;
height: 195px;
background: url('logo2.png') no-repeat;
float: left;
}

.logo2 h2{
color: white;
font-family: "Tahoma";
font-size: 14px;
margin-top: 170px;
margin-left: 10px;
}

.menu {
width: 252px;
height: 145px;
float: left;
}

.menu span {
position: relative;
top: 5px;
margin-left: 30px;
font-size: 17px;
color: black;
}

.menu_item_1 a {
width: 252px;
height: 29px;
background: url('menu_item_1.png') no-repeat;
float: left;
}

.menu_item_1 a:hover {
background-position: -252px 0;
}

.menu_item_2 a {
width: 252px;
height: 29px;
background: url('menu_item_2.png') no-repeat;
float: left;
}

.menu_item_2 a:hover {
background-position: -252px 0;
}

.menu_item_3 a {
width: 252px;
height: 29px;
background: url('menu_item_3.png') no-repeat;
float: left;
}

.menu_item_3 a:hover {
background-position: -252px 0;
}

.menu_item_4 a {
width: 252px;
height: 29px;
background: url('menu_item_4.png') no-repeat;
float: left;
}

.menu_item_4 a:hover {
background-position: -252px 0;
}

.menu_item_5 a {
width: 252px;
height: 29px;
background: url('menu_item_5.png') no-repeat;
float: left;
}

.menu_item_5 a:hover {
background-position: -252px 0;
}

.wrapping_2 {
width: 252px;
height: 547px;
float: left;
background-color: white;
}

.news {
width: 252px;
height: 402px;
float: left;
background: url('news.png') no-repeat;
background-color: white;
}

.main_content {
width: 477px;
min-height: 547px;
_height: 547px;
float: left;
background: url('main_content_background.png') repeat-x #FFFFFF;
}

.wrapping_3 {
width: 747px;
background: url('wrapping_3_background.png') repeat-y;
}

.shadow_right_2 {
width: 9px;
height: 532px;
float: left;
background: url('shadow_right_2.png') no-repeat;
}

.footer {
width: 747px;
height: 38px;
float: right;
background: url('footer.png') no-repeat;
}
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cs" lang="cs">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta content="text/html; charset=utf-8" http-equiv="content-type" />
    <meta name="description" content="Place your page description here." />
    <meta name="keywords" content="put,your,key words,phrases,here" />
    <title>
    </title>
    <link rel="stylesheet" href="style.css" type="text/css" />
  </head>
  <body>
    <div class="wrapping">
      <div class="logo"></div>
      <div class="logo2">
        <h2>
          AAABBBCCC
        </h2>
      </div>
      <div class="wrapping_3">
      <div class="shadow_left"></div>
      <div class="wrapping_2">
        <div class="menu">
          <div class="menu_item_1">
            <a href="#"><span>Police</span></a>
          </div>
          <div class="menu_item_2">
            <a href="#"><span>Police</span></a>
          </div>
          <div class="menu_item_3">
            <a href="#"><span>Police</span></a>
          </div>
          <div class="menu_item_4">
            <a href="#"><span>Police</span></a>
          </div>
          <div class="menu_item_5">
            <a href="#"><span>Police</span></a>
          </div>
        </div>
        <div class="news"></div>
      </div>
      <div class="main_content"><p>Lorem ipsum dolor sit […]
</p></div>
      <div class="shadow_right_2"></div></div>
      <div class="footer"></div>
    </div>
  </body>
</html>

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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