18-05-2010, 03:21
Witam Serdecznie
Słuchajcie mam problem na początku pokażę kod co udało mi się wymodzić wiem że pewnie będzie zawierał błędy bo dopiero jestem początkujący
KOD:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<title>TYTUŁ</title>
<style type="text/css">
body {margin: 0;
padding: 0;
width:980px;
text-align:center;
position: relatvie; margin: 0px auto;
}
#TOP {width: 980px;
background-color: #660000;
height: 20px;
}
#NAGLOWEK { background-color: #CC0000;
height:150px;
background-image: url(GRAFIKA/Baner22.jpg);
background-repeat:no-repeat;
}
#HASLO {height:30px; background-color: #660000;}
#MENUPOZ {height:30px;
background-color: #660000;
text-decoration:none;
}
#MENUPOZ ul, ul li {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
#MENUPOZ ul li {
float: left;
}
#MENUPOZ ul a:link, ul a:visited {
text-decoration: none;
display: block;
width: 80px;
text-align: center;
background-color: #ccc;
color: #000;
border: 2px outset #ccc;
padding: 5px;
}
#MENUPOZ ul a:hover {
border-style: inset;
padding: 7px 3px 3px 7px;
float: inherit;
}
#MENU {width: 150px;
height:500px;
float: left;
overflow: inherit;
background-color:#660000;
width:auto;
}
#MENU ul, ul li {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
#MENU ul {
width: 150px;
}
#MENU ul a:link, ul a:visited {
display: block;
width: 136px;
text-decoration: none;
background-color: #663300;
color: #FFFFFF;
padding: 5px;
border: 1px outset #ccc;
font-size:12px;
}
#MENU ul a:hover {
border-style: inset;
padding: 8px 4px 4px 8px;
}
#TRESC {width: 680px;
float: left;
overflow:hidden;
background-color: #ECEAEC;
height:500px;
text-align:justify
}
#INFORMACJE {width: 150px;
float:right;
overflow:hidden;
background-color: #660000;
height:500px;
}
#STOPKA {clear:both;
width: 100%;
background-color:#660000;
}
.czcionka {color:#FFFFFF; margin-top:10px; font-size:24px;}
.text {margin-top:10px; margin-right:10px; margin-left:10px; margin-bottom:10px;}
.text2 {margin-top:10px; margin-right:10px; margin-left:10px; margin-bottom:10px;}
</style>
</head>
<body>
<div id="TOP">TOP</div>
<div id="NAGLOWEK"></div>
<div id="HASLO"><b><font class="czcionka">tekst hasła</font></b></div>
</div>
<div id="MENU">
<ul id="MENU">
<li><a href="link1.html">LINK</a></li>
<li><a href="link2.html">LINK</a></li>
<li><a href="link3.html">LINK</a></li>
<li><a href="link4.html">LINK</a></li>
<li><a href="link5.html">LINK</a></li>
<li><a href="link6.html">LINK</a></li>
<li><a href="link7.html">LINK</a></li>
<li><a href="link8.html">LINK</a></li>
<li><a href="link9.html">LINK</a></li>
</ul>
</div>
<div id="MENUPOZ">
<ul id="MENUPOZ">
<!--
<li><a href="link1.html">Link1</a></li>
<li><a href="link2.html">Link2</a></li>
<li><a href="link3.html">Link3</a></li>
<li><a href="link4.html">Link4</a></li>
-->
</ul>
<div id="TRESC"><p class="text">TEKST DOKUMENTU</b></p></div>
<div id="INFORMACJE">Info</div>
<div id="STOPKA"><font size="2px" color="white"><b>Copyright by ....</a></b></font></div>
</div>
</body>
</html>
Problem:
Mianowicie chodzi mi o ustawienie MENU POZ 2
MENU POZ - jest to normalne pionowe menu znajdujące się po lewej stronie zaś MENU Poz2 chciałem dać na sam środek i problem polega na tym że nie potrafię tego zrobić
Próbowałem to wsadzić w tabele ale np przy IE 6.0 niestety style padały tzn menu traciło kolor swój. no i oczywiście będę bardzo zobowiązany o wykazanie błędów które popełniam od czegoś trzeba zacząć
Słuchajcie mam problem na początku pokażę kod
co udało mi się wymodzić wiem że pewnie będzie zawierał błędy bo dopiero jestem początkujący KOD:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<title>TYTUŁ</title>
<style type="text/css">
body {margin: 0;
padding: 0;
width:980px;
text-align:center;
position: relatvie; margin: 0px auto;
}
#TOP {width: 980px;
background-color: #660000;
height: 20px;
}
#NAGLOWEK { background-color: #CC0000;
height:150px;
background-image: url(GRAFIKA/Baner22.jpg);
background-repeat:no-repeat;
}
#HASLO {height:30px; background-color: #660000;}
#MENUPOZ {height:30px;
background-color: #660000;
text-decoration:none;
}
#MENUPOZ ul, ul li {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
#MENUPOZ ul li {
float: left;
}
#MENUPOZ ul a:link, ul a:visited {
text-decoration: none;
display: block;
width: 80px;
text-align: center;
background-color: #ccc;
color: #000;
border: 2px outset #ccc;
padding: 5px;
}
#MENUPOZ ul a:hover {
border-style: inset;
padding: 7px 3px 3px 7px;
float: inherit;
}
#MENU {width: 150px;
height:500px;
float: left;
overflow: inherit;
background-color:#660000;
width:auto;
}
#MENU ul, ul li {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
#MENU ul {
width: 150px;
}
#MENU ul a:link, ul a:visited {
display: block;
width: 136px;
text-decoration: none;
background-color: #663300;
color: #FFFFFF;
padding: 5px;
border: 1px outset #ccc;
font-size:12px;
}
#MENU ul a:hover {
border-style: inset;
padding: 8px 4px 4px 8px;
}
#TRESC {width: 680px;
float: left;
overflow:hidden;
background-color: #ECEAEC;
height:500px;
text-align:justify
}
#INFORMACJE {width: 150px;
float:right;
overflow:hidden;
background-color: #660000;
height:500px;
}
#STOPKA {clear:both;
width: 100%;
background-color:#660000;
}
.czcionka {color:#FFFFFF; margin-top:10px; font-size:24px;}
.text {margin-top:10px; margin-right:10px; margin-left:10px; margin-bottom:10px;}
.text2 {margin-top:10px; margin-right:10px; margin-left:10px; margin-bottom:10px;}
</style>
</head>
<body>
<div id="TOP">TOP</div>
<div id="NAGLOWEK"></div>
<div id="HASLO"><b><font class="czcionka">tekst hasła</font></b></div>
</div>
<div id="MENU">
<ul id="MENU">
<li><a href="link1.html">LINK</a></li>
<li><a href="link2.html">LINK</a></li>
<li><a href="link3.html">LINK</a></li>
<li><a href="link4.html">LINK</a></li>
<li><a href="link5.html">LINK</a></li>
<li><a href="link6.html">LINK</a></li>
<li><a href="link7.html">LINK</a></li>
<li><a href="link8.html">LINK</a></li>
<li><a href="link9.html">LINK</a></li>
</ul>
</div>
<div id="MENUPOZ">
<ul id="MENUPOZ">
<!--
<li><a href="link1.html">Link1</a></li>
<li><a href="link2.html">Link2</a></li>
<li><a href="link3.html">Link3</a></li>
<li><a href="link4.html">Link4</a></li>
-->
</ul>
<div id="TRESC"><p class="text">TEKST DOKUMENTU</b></p></div>
<div id="INFORMACJE">Info</div>
<div id="STOPKA"><font size="2px" color="white"><b>Copyright by ....</a></b></font></div>
</div>
</body>
</html>
Problem:
Mianowicie chodzi mi o ustawienie MENU POZ 2
MENU POZ - jest to normalne pionowe menu znajdujące się po lewej stronie zaś MENU Poz2 chciałem dać na sam środek i problem polega na tym że nie potrafię tego zrobić
Próbowałem to wsadzić w tabele ale np przy IE 6.0 niestety style padały tzn menu traciło kolor swój. no i oczywiście będę bardzo zobowiązany o wykazanie błędów
które popełniam od czegoś trzeba zacząć
