Hier die Rahmen, die du um deinen Code packen musst.
HTML-Code:
<!-- jQuery -->
<script>
(function($) {
$(document).ready(function() {
// Code here
});
})(jQuery);
</script>
<!-- MooTools -->
<script>
(function($) {
window.addEvent('domready', function() {
// Code here
});
})(document.id);
</script>
SCRIPT musst du in js-Dateien natürlich weglassen.
Der DOM: http://de.wikipedia.org/wiki/Document_Object_Model Bild auf der rechten Seite sagt schon fast alles.
Javascript untersucht den DOM um ihn dann zu manipulieren, deswegen muss sicher gestellt sein, dass der DOM komplett vorhanden ist, bevor JS mit der Analyse startet.
Bei dir ist also der #container im Moment der Messung nicht so hoch wie nachher. Irgendwas macht deinen #container nach der Messung nochmal höher. Evtl. dieses .mejs_mediaelement.
Das hier ist dein CSS im HEAD von Contao
PHP-Code:
#wrapper {
width: 1620px;
margin: 0 auto
}
#header {
height: 363px
}
#left {
width: 300px;
right: 300px
}
#right {
width: 280px
}
#container {
padding-left: 300px;
padding-right: 280px
}
#footer {
height: 295px
}
Dieses CSS ist wesentlich für ein stabiles Layout. Diese Werte solltest du manuell nicht übeschreiben. Werte wie margin, border und padding solltest du auf diese Elemente auch nicht zusätzlich aufsetzen. Die Eigenschaft width solltest du keinen inneren Elementen vergeben. Sie erstrecken sich in der Breite automatisch auf den zur Verfügung stehenden Platz (nicht, wenn ein Element gefloatet ist oder absolut positioniert ist).
Das dürfte dich nochmal ein Stück weiter bringen.
ps In dem Editor hier fehlt echt mal ein Code-Highlighting für CSS und Javascript.
Lesezeichen