Autor Zpráva
Timothy
Profil *
#1 · Zasláno: 1. 4. 2007, 11:41:05
Odpovědět Citovat
Ahojte. Mam web http://freenet.boor.sk/ a mam aj taky problem, že ako spraviť to aby dva divy v strede (menu a obsah) maly vždy stejnú dlžku, teda že ked sa prida nejaky clanok a tym padom sa zdvihne height obsahu tak aby sa aj menu išiel dole.

css kod :

body {
text-align: center;
background: url(../images/poz.gif) #000;
margin: 0px;
padding: 0px;
color: #fff;
font-family: tahoma;
}

.page {
margin: auto;
width: 780px;
_width: 780px;
text-align: center;
background: #3C3C3C;
color: #fff;
border: 1px solid #000;
}
/* END BODY */

/* HLAVA */
.header {
width: 780px;
_width: 780px;
margin: auto;
height: 200px;
line-height: 200px;
background: url(../images/logo.gif) #0951CA;
text-align: left;
color: #fff;
font-size: 2.2em;
font-weight: bold;
border-bottom: 1px solid #000;
}
/* KONIEC HLAVY */

/* PATKA */
.footer {
background: #1C1C1C;
margin: auto;
text-align: center;
width: 780px;
_width: 780px;
height: 20px;
line-height: 20px;
clear: both;
color: #fff;
font-size: 0.8em;
font-weight: bold;
border-top: 1px solid #000;
}
/* END FOOTER */

/* STRED */
.obsah {
background: #3C3C3C;
width: 780px;
_width: 780px;
margin: auto;
color: #fff;
text-align: center;
margin-top: 5px;
}
.stred {
background: #3C3C3C;
width: 580px;
float: right;
color: #fff;
}
.menu {
background: #3C3C3C;
width: 200px;
_width: 200px;
float: left;
text-align: left;
color: #fff;
}
/* END STRED */

/* OBSAH */
.obsahkontajner {
border: 1px solid #000;
background: #1c1c1c;
width: 573px;
margin-right: 5px;
margin-bottom: 10px;
}

.cojevob {
width: 573px;
font-weight: bold;
color: #fff;
font-size: 0.8em;
border-bottom: 1px solid #000;
background: url(../images/cojepoz.gif) #282828;
text-align: left;
display: block;
height: 16px;
line-height: 16px;
text-align: center;
}

.nadpisclanok {
color: #fff;
background: url(../images/cojepoz.gif) #0951ca;
font-size: 0.8em;
font-weight: bold;
width: 540px;
height: 16px;
line-height: 16px;
text-align: left;
margin: auto;
margin-top: 10px;
border-top: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
}

.patkaclanok {
color: #fff;
background: url(../images/cojepoz.gif) #0951ca;
font-size: 0.8em;
width: 540px;
height: 16px;
line-height: 16px;
text-align: left;
margin: auto;
border-left: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
}

.clanok {
margin: auto;
color: #fff;
font-size: 0.8em;
width: 540px;
text-align: left;
border-bottom: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
background: #282828;
}
/* END OBSAH */

/* MENU */
.menukontajner {
border: 1px solid #000;
width: 188px;
margin-right: 5px;
margin-left: 5px;
margin-bottom: 5px;
}

.cojevm {
font-weight: bold;
color: #fff;
font-family: calibri;
font-size: 0.8em;
border-bottom: 1px solid #000;
background: url(../images/cojepoz.gif) #282828;
width: 188px;
height: 16px;
line-height: 16px;
}
.polozkavmenu {
text-align: left;
color: #fff;
font-size: 0.8em;
width: 188px;
height: 15px;
line-height: 15px;
background: url(../images/sipka.gif) #1c1c1c;
}
.polozkavmenu a {
display: block;
color: #fff;
}
.polozkavmenu a:hover {
background: url(../images/sipkap.gif) #282828;
color: #fff;
}

a html vyzera takto:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>FreeNet</title>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta http-equiv="content-language" content="SK"/>
<meta name="description" content="FreeNET Brezová">
<meta name="author" content="Shanoy ">
<meta name="copyright" content="© Shanoy 2006">
<meta name="robots" content="all,follow">

<link rel="stylesheet" type="text/css" href="layout/style.css">
</head>

<body>

<div class="page">

<div class="header"> </div>


<div class="obsah">


<div class="stred">

<div class="obsahkontajner">

<div class="cojevob"><strong>H</strong>OME</div>


<div class="nadpisclanok">&nbsp;&nbsp;Vítajte!</div>
<div class="clanok">
blabla
</div>
<div class="patkaclanok">&nbsp;&nbsp;Vydané: 25.01.2006 | Kategória: Home</div>

<div class="nadpisclanok">&nbsp;&nbsp;Vítajte!</div>
<div class="clanok">
blabla
</div>
<div class="patkaclanok">&nbsp;&nbsp;Vydané: 25.01.2006 | Kategória: Home</div>


<br></div>

</div>


<div id="menu">


<div class="menukontajner">
<div class="cojevm"><strong>H</strong>LAVNÉ MENU</div>
<div class="polozkavmenu"><a href="index.php">&nbsp;&nbsp;&nbsp;&nbsp;Home</a></div>
<div class="polozkavmenu"><a href="index.php?page=it-news">&nbsp;&nbsp;&nbsp;&nbsp;IT news</a></div>
<div class="polozkavmenu"><a href="index.php?page=downloads">&nbsp;&nbsp;&nbsp;&nbsp;Downloads</a>< /div>
<div class="polozkavmenu"><a href="index.php?page=navody">&nbsp;&nbsp;&nbsp;&nbsp;Návody</a></div>

<div class="polozkavmenu"><a href="index.php?page=guestbook">&nbsp;&nbsp;&nbsp;&nbsp;GuestBook</a>< /div>
<div class="polozkavmenu"><a href="index.php?page=kontakt">&nbsp;&nbsp;&nbsp;&nbsp;Kontakt</a></div >
<div class="polozkavmenu"><a href="index.php?page=links">&nbsp;&nbsp;&nbsp;&nbsp;Links</a></div>
</div>

<div class="menukontajner">
<div class="cojevm"><strong>Š</strong>TATISTIKA</div>
<div class="polozkavmenu">&nbsp;&nbsp;&nbsp;&nbsp;V príprave</div>
</div>


<div class="menukontajner">
<div class="cojevm"><strong>A</strong>NKETA</div>
blabla
</div>

</div>

<div class="footer">© 2006 | ALL RIGHTS RESERVED | FreeNET Brezová</div>


</div>
</body>
</html>

dakujem za vsetky rady
tiso
Profil
#2 · Zasláno: 1. 4. 2007, 15:30:06
Odpovědět Citovat
Obrázkom na pozadí: http://tiso.wz.cz/2-stlpcovy-layout.php
Timothy
Profil *
#3 · Zasláno: 1. 4. 2007, 15:40:02
Odpovědět Citovat
a inak pomocou css sa to neda? pretože neviem ako by som spravil henten web pomocou obrazka
tiso
Profil
#4 · Zasláno: 1. 4. 2007, 16:22:48
Odpovědět Citovat
Timothy dá, ale to riešenie sa mi nepáči, niekde si ho nájdi. Okrem toho pozri sa ako vyzerá ten obrázok na pozadí: http://tiso.wz.cz/2-stlpcovy-layout/bg2.gif Vidíš tam ešte nejaký problém?
Timothy
Profil *
#5 · Zasláno: 1. 4. 2007, 16:47:01
Odpovědět Citovat
nie diky uz som to tak spravil...
Timothy
Profil *
#6 · Zasláno: 2. 4. 2007, 15:21:30
Odpovědět Citovat
Spravil som to cez ten obrazok. Vsade aj v opere aj v firefoxe to slape len nie v IE. teda v ie to pokial je v obsahu viacej informácii ako v menu (vid: http://freenet.boor.sk/) no ked je viacej infa v menu tak to blbne (vid: http://freenet.boor.sk/anketa.php). Mozete mi poradit?

html kod:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>FreeNet | Anketa</title>
<meta http-equiv="content-type" content="text/html; charset=windows-1250" />
<meta http-equiv="content-language" content="SK" />
<meta name="description" content="FreeNET Brezová" />
<meta name="author" content="Shanoy" />
<meta name="copyright" content="© Shanoy 2007" />
<meta name="robots" content="all,follow" />

<link rel="stylesheet" type="text/css" href="layout/style.css" />
</head>

<body>

<div class="page">

<div class="header"> </div>


<div class="obsah">


<div class="stred">

<div class="obsahkontajner">
<div class="cojevob"><strong>A</strong>NKETA</div>


<br />Ďakujeme za váš hlas!<br />


<br /></div>

</div>


<div id="menu">


<div class="menukontajner">
<div class="cojevm"><strong>H</strong>LAVNÉ MENU</div>
<div class="polozkavmenu"><a href="index.php">&nbsp;&nbsp;&nbsp;&nbsp;Home</a></div>
<div class="polozkavmenu"><a href="index.php?page=it-news">&nbsp;&nbsp;&nbsp;&nbsp;IT news</a></div>
<div class="polozkavmenu"><a href="index.php?page=downloads">&nbsp;&nbsp;&nbsp;&nbsp;Downloads</a>< /div>
<div class="polozkavmenu"><a href="index.php?page=navody">&nbsp;&nbsp;&nbsp;&nbsp;Návody</a></div>
<div class="polozkavmenu"><a href="index.php?page=guestbook">&nbsp;&nbsp;&nbsp;&nbsp;GuestBook</a>< /div>
<div class="polozkavmenu"><a href="index.php?page=kontakt">&nbsp;&nbsp;&nbsp;&nbsp;Kontakt</a></div >

<div class="polozkavmenu"><a href="index.php?page=links">&nbsp;&nbsp;&nbsp;&nbsp;Links</a></div>
</div>

<div class="menukontajner">
<div class="cojevm"><strong>Š</strong>TATISTIKA</div>
<div class="polozkavmenu">&nbsp;&nbsp;&nbsp;&nbsp;V príprave</div>
</div>


<div class="menukontajner">
<div class="cojevm"><strong>A</strong>NKETA</div>
anketka
</div>

</div>

<div class="ociarka"></div>

</div>

<div class="footer">© 2006 | ALL RIGHTS RESERVED | FreeNET Brezová</div>


</div>
</body>
</html>

no a css je tu:

/* BODY */
body {
text-align: center;
background: url(../images/poz.gif) #000;
margin: 0px;
padding: 0px;
color: #fff;
font-family: tahoma;
}

.page {
margin: auto;
width: 780px;
_width: 780px;
text-align: center;
color: #fff;
}
/* END BODY */

/* HLAVA */
.header {
width: 778px;
_width: 778px;
margin: auto;
height: 198px;
line-height: 198px;
background: url(../images/logo.gif) #0951CA;
text-align: left;
color: #fff;
font-size: 2.2em;
font-weight: bold;
border: 1px solid #000;
}
/* KONIEC HLAVY */

/* PATKA */
.footer {
background: #1C1C1C;
margin: auto;
text-align: center;
width: 778px;
_width: 778px;
height: 18px;
line-height: 18px;
clear: both;
color: #fff;
font-size: 0.8em;
font-weight: bold;
border: 1px solid #000;
}
/* END FOOTER */

/* STRED */
.obsah {
background: url(../images/sss.gif);
width: 780px;
_width: 780px;
margin: auto;
color: #fff;
text-align: center;
margin-top: 5px;
margin-bottom: 5px;
}

.ociarka {
background: url(../images/sss2.gif) bottom no-repeat;
widht: 780px;
height: 1px;
margin: auto;
clear: both;
border: 0px;
}

.stred {
background: #3C3C3C;
width: 580px;
float: right;
color: #fff;
}
.menu {
background: #3C3C3C;
width: 200px;
_width: 200px;
float: left;
text-align: left;
color: #fff;
}
/* END STRED */

/* OBSAH */
.obsahkontajner {
border-top: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
background: #1c1c1c;
width: 578px;
}

.cojevob {
width: 578px;
font-weight: bold;
color: #fff;
font-size: 0.8em;
border-bottom: 1px solid #000;
background: url(../images/cojepoz.gif) #282828;
text-align: left;
display: block;
height: 16px;
line-height: 16px;
text-align: center;
}

.nadpisclanok {
color: #fff;
background: url(../images/cojepoz.gif) #0951ca;
font-size: 0.8em;
font-weight: bold;
width: 540px;
height: 16px;
line-height: 16px;
text-align: left;
margin: auto;
margin-top: 10px;
border-top: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
}

.patkaclanok {
color: #fff;
background: url(../images/cojepoz.gif) #0951ca;
font-size: 0.8em;
width: 540px;
height: 16px;
line-height: 16px;
text-align: left;
margin: auto;
border-left: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
}

.clanok {
margin: auto;
color: #fff;
font-size: 0.8em;
width: 540px;
text-align: left;
border-bottom: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
background: #282828;
}
/* END OBSAH */

/* MENU */
.menukontajner {
border-top: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
width: 193px;
}

.cojevm {
font-weight: bold;
color: #fff;
font-family: calibri;
font-size: 0.8em;
border-bottom: 1px solid #000;
background: url(../images/cojepoz.gif) #282828;
width: 193px;
height: 16px;
line-height: 16px;
}
.polozkavmenu {
text-align: left;
color: #fff;
font-size: 0.8em;
width: 193px;
height: 15px;
line-height: 15px;
background: url(../images/sipka.gif) #1c1c1c no-repeat;
}
.polozkavmenu a {
display: block;
width: 193px;
color: #fff;
}
.polozkavmenu a:hover {
background: url(../images/sipkap.gif) #282828 no-repeat;
color: #fff;
width: 193px;
display: block;
}
/* END MENU */

/* OTHER */
img {
border: 0px;
}
.left {
float: left;
padding-right: 3px;
}
a,a:active,a:visited {
text-decoration: none;
color: #fff;
}
a:hover {
text-decoration: none;
color: #fff;
}
strong {
color: #FFE21D;
}
/* END OTHER */

Dakujem za kazdu radu
Timothy
Profil *
#7 · Zasláno: 2. 4. 2007, 15:23:55
Odpovědět Citovat
proste to menu si to tam volne "lieta" ked ho nic z prava neobmedzuje.
Časová prodleva: 17 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0