|
|||
CSS-Bug (nur in IE?)
Hi Leute,
ich bin am Verzweifeln bezüglich eines CSS-Bugs, der, wie es scheint, nur beim Betrachten mit dem Internet Explorer auftaucht. Allerdings kann ich den Fehler einfach nicht entdecken. Ich habe dem "Rahmen" ein Abstand nach oben von top: 2% oder so ähnlich gegeben. Sobald man aber den Punkt "People" mit Unternavigation fährt, springt die gesamte Hauptnavigation plötzlich an den oberen Bildschirmrand. Ebenso, wenn man "Journal" anklickt. In anderen Browsern konnte ich dieses Fehlverhalten nicht sehen. Hier ist die Website: goo.gl/9YMkka Hier noch einmal der Code: Code:
html {margin: 0; overflow-y: scroll;} body {margin: 0; background: url(random_img.php) no-repeat top left fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-attachment: fixed; font-size: 1rem; font-family: 'PT Sans Narrow', Helvetica, Roboto, Arial, sans-serif; height: 100%;} #stage {margin: 1.5% auto 0 auto; padding: 0; min-height: 100%; max-width: 58.75rem; width: 100%; min-width: 20rem;} #obenlinks {margin: 0 0.2rem 0 0; line-height: 3.4rem; float: left;} #obenlinks a {display: block; line-height: 3.4rem; font-size: 1rem; color: #fff; text-decoration: none; background: rgba(210, 21, 21, .8); margin: 0; padding: 0 1.1rem; font-family: Dosis, Helvetica, Arial, sans-serif; font-weight: normal;} #obenlinks a:visited {color: #fff; text-decoration: none; background: rgba(210, 21, 21, .8); margin: 0; padding: 0 1.1rem;} #obenlinks a:hover {color: #eee; text-decoration: none; background: rgba(210, 21, 21, .99);} #obenlinks a:active {color: #fff; text-decoration: none; background: rgba(210, 21, 21, .8);} #obenmitte {margin: 0 0 0 0; background: rgba(255, 255, 255, .7); line-height: 3.4rem; overflow: hidden;} #obenrechts {float: right; margin: 0 0 0 0; line-height: 3.4rem;} #inhalt {background: rgba(255, 255, 255, .8); padding: 1rem 1.5rem; margin: 0;} #inhaltblog {background: rgba(255, 255, 255, .8); padding: 2.65rem 2rem; margin: 0;} @media screen and (min-width: 800px) { #nav {display: block; float: left; margin: 0 auto; width: 100%;} #nav ul, div.menu ul {list-style: none; margin: 0; padding: 0;} #nav li, div.menu li {float: left; position: relative;} #nav ul ul {display: none; position: absolute; left: 0; float: left; width: auto; z-index: 99999;} #nav ul.sub-menu {width: 100%;} #nav ul.sub-menu li {float: none; display: block;} #nav a {color: #333; display: block; padding: 0 1.1rem; text-decoration: none; font-weight: normal; background: rgba(255, 255, 255, .7); margin: 0 0 0 0.2rem; font-family: Dosis, Helvetica, Arial, sans-serif; font-size: 1rem;} #nav ul li:hover > ul {display: block;} #nav li:hover > a, #nav ul ul:hover > a {color: #bbb; background: rgba(255, 255, 255, .95);} #nav ul ul a {background: rgba(255, 255, 255, .7); text-align: center; line-height: 1rem; padding: 10px 10px; height: auto; margin: 2px 0 0 0.2rem;} #nav ul li.current_page_item > a, #nav ul li.current-menu-ancestor > a, #nav ul li.current-menu-item > a, #nav ul li.current-menu-parent > a {background: rgba(255, 255, 255, .99);} } |
Sponsored Links |
|
|||
Den Abstand nach oben machst Du mit margin von 1,5% bei #stage. Das kapiert der IE offenbar nicht, da es in keinem Bezug zu einem Wert eines umgebenden Elementes ist. Die Lösung wäre imho, dass Du statt 1,5% einen Wert von 1em oder ähnlich verwendest. Das klappt in meinem IE11 prima.
|
Sponsored Links |
Stichwörter |
bug, css, rand |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
IE 6 erkennt seine CSS Datei nicht | Perelina | (X)HTML | 4 | 07.08.2009 19:56 |
Vertikale CSS Navigation mit Bildern und Text | macmensa | CSS | 2 | 25.07.2009 17:23 |
Doctype und CSS Problem | tech | CSS | 3 | 29.05.2009 21:16 |
Brauche Hilfe bei preg_match | CSS im Newssystem | Zen5656 | Serveradministration und serverseitige Scripte | 21 | 19.01.2007 16:33 |
3 px Bug und css valid | rasilo | CSS | 2 | 13.05.2005 21:03 |