CSS Layout fehler
Luther
- design/layout
0 at
Also ich habe folgenden Q-code... kann bislang keine fehler erkennne habe aber auch nur nene Texteditor zur verfügung und übersehe vielleicht deshalb etwas....
mein problem liegt zz darin dass ich einen anzeige fehelr beim iframe habe unz zwar wird es wie es sein soll zz mit einem abstand von 65px rechts und links angezeigt... allerdings nur soalnge ich keine <br> irgentwo setzte oder den MARGIN-TOP enterne... plötzlich wird iframe dann auf die eine höhere breite gesetzt und fällt aus der fenster sicht heruas
ebenso habe ich das problem dass am unteren rand des iframes ca. 3 cm sinloser leerer rand sind obwohl dies nicht sein dürfte....
alle hinweise wären mir sehr nützlich ist bestimmt nur irgentwo ein logic fehler oder mal wieder ein semikolon vergessen aber ich sehs nicht.
<html>
<head>
<style type="text/css">
body, p a {
font: normal 100% Helvetica, Arial, sans-serif;
color: 000000; background-color: ffffff;
min-width: 40em; /* Mindestbreite verhindert Anzeigefehler in modernen Browsern */
margin:0;
}
#fixiert {
position: absolute;
top: 0; left: 0;
width: 100%;
height:19px;
background-color: white;
border: 1px solid silver;
}
html>body #fixiert { /* nur fuer moderne Browser! */
position: fixed;
}
#Inhalt {
margin-left: 65px;
margin-right: 65px;
margin-top:20;
}
* #Inhalt { /* versteckt vor Netscape 4 */
background-color: #ffffff;
}
ul#Navigation {
margin: 0; padding: 0;
text-align: center;
}
ul#Navigation li {
list-style: none;
float: left; /* ohne width - nach CSS 2.1 erlaubt */
position: relative;
margin: 0.0em; padding: 0;
}
ul#Navigation li ul {
margin: 0; padding: 0;
position: absolute;
top: 1.2em; left: -0.0em;
display: none; /* Unternavigation ausblenden */
}
ul#Navigation li:hover ul {
display: block; /* Unternavigation in modernen Browsern einblenden */
}
ul#Navigation a, ul#Navigation span {
display: block;
width: 6.4em; /* Breite den in li enthaltenen Elementen zuweisen */
text-decoration: none; font-weight: bold;
color: 000000; background-color: #ffffff;
}
* html ul#Navigation a, * html ul#Navigation span {
width: 8.6em; /* Breite nach altem MS-Boxmodell fuer IE 5.x */
w\idth: 6.4em; /* korrekte Breite fuer den IE 6 im standardkompatiblen Modus */
}
ul#Navigation a:hover, ul#Navigation span, li a#aktuell {
color: white; background-color: 000000;
}
li a#aktuell { /* aktuelle Rubrik kennzeichnen */
color: ffffff; background-color: black;
}
ul#Navigation li ul span { /* aktuelle Unterseite kennzeichnen */
background-color: 000000;
}
</style>
<script type="text/javascript">
if(window.navigator.systemLanguage && !window.navigator.language) {
function hoverIE() {
var LI = document.getElementById("Navigation").firstChild;
do {
if (sucheUL(LI.firstChild)) {
LI.onmouseover=einblenden; LI.onmouseout=ausblenden;
}
LI = LI.nextSibling;
}
while(LI);
}
function sucheUL(UL) {
do {
if(UL) UL = UL.nextSibling;
if(UL && UL.nodeName == "UL") return UL;
}
while(UL);
return false;
}
function einblenden() {
var UL = sucheUL(this.firstChild);
UL.style.display = "block"; UL.style.backgroundColor = "black";
}
function ausblenden() {
sucheUL(this.firstChild).style.display = "none";
}
window.onload=hoverIE;
}
</script>
</style>
<!--[if lt IE 7]><style type="text/css">
@media screen {
html, body {
height: 100%; overflow-y: hidden;
}
#Scrollbereich {
height: 100%; width: 100%; overflow: auto;
}
#Inhalt {
position: static;
}
}
</style><![endif]-->
</head>
<body background="graph/papier.jpg">
<div id="fixiert">
<ul id="Navigation">
<li><a href="schotten/entsteung.htm" target=btarget>Seite 1</a></li>
<li><a href="#Beispiel">Seite 2</a>
<ul>
<li><a href="#Beispiel">Seite 2a</a></li>
<li><a href="#Beispiel">Seite 2b</a></li>
</ul>
</li>
<li><a href="head.htm" target=btarget>Seite 3</a></li>
<li><a id="aktuell" href="#Beispiel">Seite 4</a>
<ul>
<li><a href="#Beispiel">Seite 4a</a></li>
<li><span>aktuelle Seite</span></li>
<li><a href="#Beispiel">Seite 4c</a></li>
</ul>
</li>
<li><a href="#Beispiel">Seite 5</a></li>
</ul>
</div>
<div id="Scrollbereich">
<div id="Inhalt">
<iframe src="schotten/entsteung.htm" width="100%" height="100% name="btarget" scrolling="no" frameborder="0">
</iframe>
</div>
</div>
</body>
</html>
Hallo.
Also ich habe folgenden Q-code...
"Q" steht vermutlich für "Quäl".
kann bislang keine fehler erkennne habe aber auch nur nene Texteditor zur verfügung und übersehe vielleicht deshalb etwas....
Aus diesem Grund gibt es Validatoren.
<html>
Wo deklarierst du den Dokumententypen?
color: 000000; background-color: ffffff;
Das sind keine gültigen Farbnamen oder -werte.
margin-top:20;
Zwanzig was?
ul#Navigation li {
list-style: none;
Diese Angabe sollte bereits für die Liste gemacht werden, nicht erst für die einzelnen Punkte.
color: 000000;
[...]
background-color: 000000;
Null korrekte Farbangaben.
color: ffffff;
Ffffffalsch.
background-color: 000000;
Nope.
</style>
<script type="text/javascript">
[...]
</script>
</style>
Wo öffnest du den zweiten <style>
-Bereich, den du hier schließt?
</head>
Ohne <title>
ist <head>
unvollständig.
<body background="graph/papier.jpg">
Du verwendest doch CSS.
<li><a href="schotten/entsteung.htm" target=btarget>Seite 1</a></li>
Nur am Rande: Die "Entstehung" schreibt sich mit "h". Und Anführungszeichen sind bei Attributwerten prinzipiell empfehlenswert.
<iframe src="schotten/entsteung.htm" width="100%" height="100% name="btarget" scrolling="no" frameborder="0">
Allerdings sollte man natürlich auf mit Anführungszeichen umgehen können, sprich: sie paarweise verwenden.
MfG, at