Frage stellen
ich versuche schon einige Zeit eine Webseite zu gestalten,
doch es tauchen immer wieder Probleme auf,
die ich nicht überwinden kann.
Ich habe zwei Grafiken mit abgerundeten Ecken,
die mir immer wieder unter die Navigation rutschen
Im Intenetexplorer 7 sieht es aus wie es aussehen soll,
im Firefox und Opera allerdings nicht.
Ich finde auch keinen Weg das zu ändern,
jetzt hoffe ich auf Hilfe.
Die Css und Html hänge ich hier mal an.
Html:
- Code: Alles auswählen
<DOCTYPE><html>
<head>
<title>Sotha2009</title>
<meta>
<link>
</head>
<body>
<div>
<div>
<div>
<h1>
<br>
Überschrift bla schwall bla <br>
Weitere Überschrift bla schwetz schwall <br>
</h1>
<br>
<h2>
"Erleuterung zur unterschrift <br>
usw bla bla"
</h2>
</div>
<div>
<p>
<marquee> Infokrams in laufschrift </marquee>
</p>
</div>
</div>
<div>
<ul>
<li><a> Hauptseite </a></li>
<li><a> Hauptseite </a></li>
<li><a> Hauptseite </a></li>
<li><a> Hauptseite </a></li>
<li><a> Hauptseite </a></li>
<li><a> Hauptseite </a></li>
<li><a> Hauptseite </a></li>
<li><a> Hauptseite </a></li>
</ul>
</div>
<div>
<h3>Hier kommt noch die Willkommensüberschrift.</h3>
<p>
Mit reichlich Wilkommenstext <br>
und vielleicht ein paar Bildchen.<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</p>
</div>
<div>
<div>
<p>bla Copyreigt etc.</p>
</div>
</div>
</div>
</body>
</html>
Css:
- Code: Alles auswählen
body
{
background-color: #ffffff;
font-size: 0.8em;
font-family: Arial;
color: #000000;
padding: 0;
margin: 0;
}
a { color: #000000; }
a:visited { color: #000000; }
a:hover { color: #ffffff; }
a:active { color: #000000; }
p
{
padding: 5px;
margin:0;
}
h1
{
color: #ffffff;
padding: 0;
margin:0;
font-size: 1.2em;
font-weight: bold;
}
h2
{
padding: 0;
margin:0;
font-size: 1.4em;
font-weight: bold;
}
h3
{
padding: 5px;
margin:0;
font-size: 1.8em;
font-weight: bold;
}
h4
{
padding: 5px;
margin:0;
font-size: 1.6em;
font-weight: lighter;
}
#navi
{
padding-left: 0;
margin-left: 0;
border-bottom: 1px solid;
border-color: #ffdaaa;
width: 150px;
}
#navi li
{
list-style: none;
margin: 0;
padding: 0.25em;
border-top: 1px solid;
border-color: #ffdaaa;
}
#navi li a
{
text-decoration: none;
}
#center
{
width: 900px;
margin: 0 auto;
padding: 0;
background-color: #d2c7e8;
}
#banner
{
height: 250px;
margin: 0;
padding: 0;
background-color: #d2c7e8;
background-image: url(designbilder/top.jpg);
background-repeat: no-repeat;
background-position: center;
}
#btext
{
text-align: center;
margin-top: 30px;
margin-left: 255px;
padding: 0;
width: 560px;
height: 110px;
}
#info
{
margin-top: 44px;
margin-left: 233px;
width: 538px;
height: 25px;
padding: 0;
background-color: #d2c7e8;
}
#content
{
min-height:600px;
background-color: #ffdaaa;
padding: 20px;
margin: 0 0 0 150px;
}
#links
{
float: left;
width: 150px;
margin: 0;
padding: 15px 0 0 0;
color: #ffffff;
background-color: #d2c7e8;
}
#fuszeile
{
clear: left;
height: 40px;
background-image: url(designbilder/fus.jpg);
background-repeat: no-repeat;
background-position: center;
background-color: #d2c7e8;
padding: 0;
margin: 0;
}
#ftext
{
color: #ffdaaa;
text-align: right;
margin-top: -4px;
margin-left: 10px;
padding: 0;
width: 880px;
height: 25px;
}
div.rund
{
margin: 0;
width: 600px;
background: url(ul.jpg) no-repeat bottom left;
}
div.rund h3
{
margin: 0;
padding: 20px;
background: url(ol.jpg) no-repeat top left;
text-align: center;
font-size:1.2em;
}
div.rund p
{
margin: 0;
padding: 20px;
}
Perfekt 
