| Autor |
Nachricht |
Xaven
Threadersteller
Dabei seit: 26.03.2002
Ort: Motorcity Rüsselsheim
Alter: 41
Geschlecht: 
|
Verfasst Mi 05.07.2006 18:04
Titel [CSS] DIV Navigation |
  |
|
Servus!
It's me again.
Schaut euch die Seite hier bitte mal an:
www.shoefiller.de/beta/index2.html
Im Feuerfox stimmt alles - die Navigation "klebt" an dem DIV mit dem Inhalt.
Im Internet Explorer dagegen schwebt die Navigationsleiste in der Luft und die Buttons haben auch nicht die richtige Größe.
Whats my fault?
Besten Dank im voraus.
CSS:
| Code: | /* CSS Document */
#page {
text-align:left;
margin:0 auto;
width:704px;
}
#inhalt{
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
text-align: left;
width: 644px;
padding: 20px 20px 20px 20px;
background-color:#F5F1F1;
border-left: 30px solid #FFFFFF;
border-right: 30px solid #FFFFFF;
border-bottom: 30px solid #FFFFFF;
border-top: 30px solid #FFFFFF;
float:left;
/* filter:alpha(opacity=50);
-moz-opacity:0.5;
opacity:0.5; */
}
#navcontainer {
height: 25px;
}
#navlist ul {
margin-left: 0;
padding-left: 0;
white-space: nowrap;
}
#navlist li {
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
display: inline;
list-style-type: none;
}
#navlist a { padding: 7px 12px;}
#navlist a:link, #navlist a:visited {
color: #000000;
background-color: #FFFFFF;
text-decoration: none;
}
#navlist a:hover {
color: #FFCC33;
background-color: #FFFFFF;
text-decoration: none;
}
h1 {
font-size:16px;
} |
HTML:
| Code: | <!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-1" />
<link rel="stylesheet" type="text/css" href="styles2.css" />
<title>SHOEFILLER</title>
<style type="text/css">
<!--
body {
background-image: url(img/hintergrund.jpg);
background-attachment:fixed;
}
-->
</style></head>
<body>
<div id="page">
<div id="navcontainer">
<ul id="navlist">
<li><a href="#" title="Produkt">PRODUKT</a></li>
<li><a href="#" title="Bestellen">BESTELLEN</a></li>
<li><a href="#" title="Impressum">IMPRESSUM</a></li>
<li><a href="#" title="Shoefiller">SHOEFILLER</a></li>
</div>
</ul>
<div id="inhalt">
Teeeeeext!
</div>
</div>
</body>
</html>
|
Zuletzt bearbeitet von Xaven am Mi 05.07.2006 18:06, insgesamt 1-mal bearbeitet
|
|
| |
   |
 |
sahnemuh
Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht:
|
Verfasst Mi 05.07.2006 18:52
Titel
|
|
|
hier.. ich hab mal ein wenig ausgemistet und so.
| Code: | body {
font-family: Arial, Helvetica, sans-serif;
padding-top: 20px;
}
#page {
margin: 0px auto;
width: 704px;
}
#inhalt {
border: 30px solid #fff;
padding: 20px;
font-size: 11px;
width: 644px;
background-color: #f5f1f1;
}
ul#navlist {
display: block;
width: 704px;
height: 25px
padding: 0;
margin: 0;
line-height: 25px;
margin-left: 0;
padding-left: 0;
}
ul#navlist li {
padding: 0;
display: inline;
font-size: 14px;
list-style-type: none;
background-color: #fff;
margin-right: 2px;
}
ul#navlist a {
text-decoration: none;
padding: 7px 12px 7px 12px;
color: #000;
background-color: #fff;
}
ul#navlist a:hover {
COLOR: #fc3;
}
h1 {
FONT-SIZE: 16px
}
|
| Code: |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>SHOEFILLER</title>
<meta http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<link href="styles2.css" type="text/css" rel="stylesheet">
<style type=text/css>body {
background-attachment: fixed;
background-image: url(img/hintergrund.jpg/hintergrund.jpg)
}
</style>
</head>
<body>
<div id=page>
<ul id=navlist>
<LI><A title=Produkt href="http://www.shoefiller.de/beta/index2.html#">PRODUKT</a></li>
<LI><A title=Bestellen href="http://www.shoefiller.de/beta/index2.html#">BESTELLEN</a></li>
<LI><A title=Impressum href="http://www.shoefiller.de/beta/index2.html#">IMPRESSUM</a></li>
<LI><A title=Shoefiller href="http://www.shoefiller.de/beta/index2.html#">SHOEFILLER</a></li>
</ul>
<div id=inhalt>
<h1>Headline</h1>Total viel Text!
</div>
</div>
</body>
</html>
|
da war einiges unnötige dabei (etwa das containerdiv für die navi) und ein paar kleine fehler bzw. unschöner / unnötiger code.
vergleich einfach mal vorher und nachher.
Zuletzt bearbeitet von sahnemuh am Mi 05.07.2006 21:16, insgesamt 3-mal bearbeitet
|
|
| |
|
|
|
Anzeige
|
|
|
Xaven
Threadersteller
Dabei seit: 26.03.2002
Ort: Motorcity Rüsselsheim
Alter: 41
Geschlecht:
|
Verfasst Do 06.07.2006 09:46
Titel
|
|
|
| sahnemuh hat geschrieben: | hier.. ich hab mal ein wenig ausgemistet und so.
da war einiges unnötige dabei (etwa das containerdiv für die navi) und ein paar kleine fehler bzw. unschöner / unnötiger code.
vergleich einfach mal vorher und nachher. |
Saugeil. Funzt wunderbar. Vielen Dank!
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
Navigation - IE6 + 7
[PHP, XML] Navigation...
Navigation PHP
CSS: Navigation
navigation
Navigation mit PHP
|
|
Willkommen auf dem Portal für Mediengestalter
