Tworzę obecnie layout strony szkoły. Zabierając się za to nie miałem żadnej wiedzy o CSS
Ale doszłem do tego: www.na-technike.yoyo.pl
Mam kilka pytań: co zrobić by menu po lewej stronie wypełniało cały dany mu obszar? Od nagłówka po stopkę? Co odbija IE?
Co uważacie za dobre a co trzeba zmienić? Dzięki z góry za kreatywne odpowiedzi. Ach i to chyba oczywiste, że menu po lewej nie poświęciłem więcej niż minutę...wcześniej planowałem tam zaokrąglone buttony, ale nie pasuje to do sztywności strony do tych prościutkich krawędzi. Napiszcie proszę też coś od strony artystycznej
CSS:
CODE
html, body {
background-color: #000000;
color: #000;
margin: 0;
padding: 0;
}
#top {
width:780px;
margin:0 auto;
height:auto;
}
#NAGLOWEK {
margin-top:5px;
background-color:#888;
height:90px;
background-image:url(header.jpg);
margin-bottom:5px;
}
#MENU {
width:150px;
height:auto;
float:left;
overflow:hidden;
background-color:#ccc;
margin-right:4px;
}
#MENU dl {
margin: 0px;
margin-bottom:15px;
}
#MENU dt {
font-size: 17px;
font-weight: bold;
height:20px;
width:150px;
padding-top:6px;
text-align:center;
}
#MENU dd {
font-size:13px;
margin-top:3px;
margin-left:6px;
}
#MENU a {
font-size:14px;
line-height: 135%;
}
#TRESC {
width:626px;
float:left;
overflow:hidden;
background-color:#ccc;
margin-bottom:5px;
}
#info {
float:left;
margin-left:15px;
margin-top:6px;
margin-bottom:10px;
}
#info dl {
margin: 0px;
margin-bottom:15px;
margin-left:5px;
}
#info dt {
font-size: 17px;
font-weight: bold;
height:20px;
width:auto;
text-align:left;
margin-top:5px;
}
#info dd {
font-size:13px;
margin-top:3px;
}
#obraz {
height:300px;
font-size:18px;
float:right;
margin-top:10px;
margin-right:10px;
text-align:center;
}
#STOPKA {
clear:both;
width:100%;
background-color:#888;
text-align:center;
}
background-color: #000000;
color: #000;
margin: 0;
padding: 0;
}
#top {
width:780px;
margin:0 auto;
height:auto;
}
#NAGLOWEK {
margin-top:5px;
background-color:#888;
height:90px;
background-image:url(header.jpg);
margin-bottom:5px;
}
#MENU {
width:150px;
height:auto;
float:left;
overflow:hidden;
background-color:#ccc;
margin-right:4px;
}
#MENU dl {
margin: 0px;
margin-bottom:15px;
}
#MENU dt {
font-size: 17px;
font-weight: bold;
height:20px;
width:150px;
padding-top:6px;
text-align:center;
}
#MENU dd {
font-size:13px;
margin-top:3px;
margin-left:6px;
}
#MENU a {
font-size:14px;
line-height: 135%;
}
#TRESC {
width:626px;
float:left;
overflow:hidden;
background-color:#ccc;
margin-bottom:5px;
}
#info {
float:left;
margin-left:15px;
margin-top:6px;
margin-bottom:10px;
}
#info dl {
margin: 0px;
margin-bottom:15px;
margin-left:5px;
}
#info dt {
font-size: 17px;
font-weight: bold;
height:20px;
width:auto;
text-align:left;
margin-top:5px;
}
#info dd {
font-size:13px;
margin-top:3px;
}
#obraz {
height:300px;
font-size:18px;
float:right;
margin-top:10px;
margin-right:10px;
text-align:center;
}
#STOPKA {
clear:both;
width:100%;
background-color:#888;
text-align:center;
}