Autor Zpráva
hellboy
Profil *
#1 · Zasláno: 10. 2. 2008, 10:04:53
Odpovědět Citovat
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 *
#2 · Zasláno: 10. 2. 2008, 10:05:49
Odpovědět Citovat
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
#3 · Zasláno: 10. 2. 2008, 10:07:13
Odpovědět Citovat
Odpovídám hellboy:
http://www.google.com/search?rls=cs&q=sloupce+stejn%C4%9B+vysok%C3%A9
hellboy
Profil *
#4 · Zasláno: 10. 2. 2008, 10:14:40
Odpovědět Citovat
Dobry mno, to me taky napadlo, ale rikal jsem si, ze to je prasana....
Bubák
Profil
#5 · Zasláno: 10. 2. 2008, 10:41:04
Odpovědět Citovat
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 *
#6 · Zasláno: 10. 2. 2008, 15:08:27 · Upravil/a: Moderátor (editace znemožněna)
Odpovědět Citovat
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>
Časová prodleva: 16 let

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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

0