Hallo Leute,
vielleicht kann mir einer das Mal erklären, sodass ich Anfänger das auch verstehe.
Ich bin gerade dabei für eine Freundin Ihre Webseite neu zu erstellen und habe ein kleines Problem mit der Darstellung im IE 5 und 6. Das ist meine erste Seite mit reinem CSS und nicht wie sonst Tabellenlayout in Kombination mit Ebenen.
Die Nachmittage mit Google haben zwar mir was zum Lesen gebracht und probieren, aber zum Erfolg hat es nicht gelangt. Ich weiß ich könnte auch sagen, wer noch alte Browser hat, der hat Pech. Aber dass wollen wir ja auch nicht.
Falls jemand einen Tipp hat wäre ich Ihn dankbar.
Gruß Rogér
CSS
vielleicht kann mir einer das Mal erklären, sodass ich Anfänger das auch verstehe.
Ich bin gerade dabei für eine Freundin Ihre Webseite neu zu erstellen und habe ein kleines Problem mit der Darstellung im IE 5 und 6. Das ist meine erste Seite mit reinem CSS und nicht wie sonst Tabellenlayout in Kombination mit Ebenen.
Die Nachmittage mit Google haben zwar mir was zum Lesen gebracht und probieren, aber zum Erfolg hat es nicht gelangt. Ich weiß ich könnte auch sagen, wer noch alte Browser hat, der hat Pech. Aber dass wollen wir ja auch nicht.
Falls jemand einen Tipp hat wäre ich Ihn dankbar.
Gruß Rogér
CSS
Code:
*{
margin:0;
padding:0;
}
body {
background-image: url(../Hompage-Bilder/Backgroundpic.gif);
background-repeat: repeat;
width: 100%;
height: 100%;
margin: 0;
padding: 0; }
h1 {
color: #bacd9a;
font-size: 18px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
font-style: normal;
line-height: 22px;
text-align: left;
margin: 50px 0 16px;
padding: 10px 0 5px 0;
border-bottom: 1px solid #333; }
h2 {
color: #bacd9a;
font-size: 16px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
font-style: normal;
line-height: 18px;
text-align: left;
margin: 30px 0 16px;
padding: 0 0 5px 0;
border-bottom: 1px solid #333; }
h3 {
color: #bacd9a;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: normal;
font-style: normal;
line-height: 14px;
text-align: left;
margin: 1px 0 10px;
padding: 0; }
p {
color: #fff;
font: 11px/14px Verdana, Arial, Helvetica, sans-serif;
text-align: left;
margin: 0 0 20px;
padding: 0; }
#box {
background-image: url(../Hompage-Bilder/Mainpic.gif);
width: 980px;
height: auto;
margin: 0 auto; }
#header {
background-image: url(../Hompage-Bilder/Headpic.gif);
background-repeat: no-repeat;
width: 980px;
height: 260px; }
#content {
width: 980px;
height: auto; }
#sidebar {
width: 180px;
height: auto;
float: left;
margin-top: 0;
margin-left: 100px;
padding: 0; }
#contentarea {
width: 560px;
height: auto;
float: right;
margin-right: 80px; }
#box1 {
text-align: left;
width: 150px;
height: 160px;
margin:10px 0 10px 10px;
padding: 0 0 0 10px;
float: left; }
#box1l {
text-align: left;
width: 150px;
height: 160px;
margin:10px 0 10px 10px;
padding: 0 0 0 10px;
float: left;
border-left: 1px solid #333; }
#box2 {
text-align: left;
width: 200px;
height: 300px;
margin: 0;
padding: 0;
float: right; }
div.clear {
clear: both;
height: 0;
font-size: 0;
margin: 0;
padding: 0; }
#footer {
background-image: url(../Hompage-Bilder/Footerpic.gif);
background-repeat: no-repeat;
clear: both;
width: 980px;
height: 130px; }
#navcontainer
{ width: 180px; padding: 0; color: #333; font-size: 12px; font-family: Verdana, Arial, Helvetica, sans-serif; height: auto; margin-top: 50px; }
#navcontainer ul
{ height: 35px; list-style: none; margin: 0; padding: 0; }
#navcontainer li
{ height: 35px; margin: 2px 0 0; }
#navcontainer li a
{ display: block; color: #bacd9a; background-image: url(../Hompage-Bilder/button_vert.gif); background-repeat: no-repeat; text-decoration: none; width: 100%; height: 35px; margin-top: 2px; padding-top: 10px; padding-left: 20px; }
html>body #navcontainer li a { width: auto; }
#navcontainer li a:hover
{ color: #fff; background-image: url(../Hompage-Bilder/button_vert_over.gif); background-repeat: no-repeat; height: 35px; margin-top: 2px; }