Hallo zusammen,
ich habe folgendes Problem. Auf der Website soll oben ein 100 % breiter Bereich entstehen, der die skalierbare Navigation aufnimmt.
Mit dem u.g. Code zeigen aber IE und auch der Firefox einen horizontalen Balken an. Beim IE kann ich diesen Balken ja noch mit
html {
overflow-x: hidden;
}
unterbinden, aber beim Firefox ändert sich natürlich nichts. Hab ich irgendwo einen Fehler im u.g. Code, oder was kann man anders machen?
und die CSS-Datei
Viele Grüße
Matthias
ich habe folgendes Problem. Auf der Website soll oben ein 100 % breiter Bereich entstehen, der die skalierbare Navigation aufnimmt.
Mit dem u.g. Code zeigen aber IE und auch der Firefox einen horizontalen Balken an. Beim IE kann ich diesen Balken ja noch mit
html {
overflow-x: hidden;
}
unterbinden, aber beim Firefox ändert sich natürlich nichts. Hab ich irgendwo einen Fehler im u.g. Code, oder was kann man anders machen?
HTML:
<!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" lang="en" xml:lang="en">
<head>
<title>myhome.de</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
@import url("/css/screen.css");
</style>
</head>
<body id="intro">
<ul id="nav">
<li id="intro"><a href="/">Magazin</a></li>
<li id="service"><a href="service.html">Service</a></li>
<li id="gemeinschaft"><a href="gemeinschaft.html">Gemeinschaft</a></li>
<li id="ueber_uns"><a href="ueber_uns.html">Über uns </a></li>
</ul>
</body>
</html>
und die CSS-Datei
HTML:
/* CSS Dokument */
body {
margin: 0;
padding: 0;
font-size: small;
}
#nav {
float: left;
width: 100%;
margin: 0;
padding: 60px 0 0 155px;
list-style: none;
background: #ECECF1 url(/img/nav_bg.gif) repeat-x bottom left;
}
#nav li {
float: left;
margin: 0;
padding: 0;
font-family: "Lucida Grande", sans-serif;
}
#nav a {
float: left;
display: block;
margin: 0 1px 0 0;
padding: 4px 8px;
color: #333;
text-decoration: none;
border: 1px solid #9B8748;
border-bottom: none;
background: #F9E9A9 url(/img/off_bg.gif) repeat-x top left;
}
#nav a:hover, body#intro #intro a {
color: #333;
padding-bottom: 5px;
border-color: #727377;
background: #fff url(/img/on_bg.gif) repeat-x top left;
}
Viele Grüße
Matthias
Zuletzt bearbeitet: