height attribut hängt

    Hallo da draussen.

    Ich bin jetzt seit Stunden hinter einem Darstellungsfehler her, den ich einfach nicht durchschaue. Vllt. hat hier ja jemand eine Idee.

    Schaut mal hier: http://fewo.lausch.net/ soweit alles prima.
    Jetzt klickt im Menü mal auf z.b. "blog" oder "news".
    Warum bitte ändert die dunkelgrüne Box oben links (da, wo "test" drinsteht) Ihre Höhe? Im Code steht doch definitiv drin
    <td rowspan="2" bgcolor="#c7e19e" height="128" valign="middle" width="110">
    <div>test</div>
    </td>

    daß das td eine fest definierte Höhe haben soll.
    Man sollte doch meinen, daß, wenn sich die Höhe der Seite ändert, daß dann nicht gerade _die_ Box größer skaliert wird, die eine feste Höhenangabe hat, sondern eher alle anderen?!?
    Im IE geht das auch, aber im FF scheint das "height" hier ignoriert zu werden.

    Hat jemand eine Idee?
    Vielen Dank und viele Grüße,
    Southy

    Versuchs mal mit nem CSS-Format. height ist deprecated. Eigentlich sollte es FF trotzdem machen, aber ich hab mir das jetzt nicht näher angeschaut. Wie gesagt, einfach mal statt height style="height:128px" nehmen.

    Mozilla/5.0 (Windows; U; Windows NT 5.1; de; rv:1.8.1.1) Gecko/20061204 Firefox/2.0.0.1

    Eine Theorie sollte so einfach wie möglich sein, aber nicht einfacher. (A. Einstein)

    Offensichtlich hast Du dein Problem bereits gelösst. Oder gut versteckt. Ich finde nämlich keine Menueinträge Names "blog" oder "news". Und das bestehende Menu verändert auch seine Höhe nicht.

    Naja. Egal. Will mich trotzdem mal was wichtigtun:

    Bei einem Table wirkt das height/width immer wie ein min-width bzw. min-height. Auch beim IE. Absolute Werte schützen den Bereich nicht. Wenn man ein grösseres Content-Element einbindet, dann wird das <TD> geweitet.

    Ich vermute viel eher, dass es am unterschiedlichen Boxmodell der beiden Browser liegt. Firefox hält sich dort an den Standard, wärend IE seine eigene Suppe kocht.

    Wenn Du in einem <TD> der grösse 130*20 Pixel beim IE einen Link (<a>) legst, diesen als block definierst (display:block) und die werte "width:130px; height 20px; border:1px; padding:2px;" per css-hover zuweisst, dann wird IE einen link anzeigen, der 130*20 Pixel gross ist und damit den TD nicht ausdehnt. Firefox wird aber ein element anzeigen das 136*26 Pixel gross ist und damit das TD für die dauer des hover's ausdehnt.

    Warum? Unterschiedlichses Boxmodell. Mehr erfahren zum boxmodell?

    http://www.tantek.com/CSS/Examples/boxmodelhack.html
    http://barrierefrei.e-workers.de/workshops/ie-fun/index1.php
    http://www.howtocreate.co.uk/wrongWithIE/?chapter=Box+Model

    prüfe mal border-, padding- und width-/height-werte in hover und in der normalen link-pseudoklasse. die werte sollten immer identisch sein.

    wenn du padding und border angibst, gib keine height/weight-angaben dazu und andersrum. sonst kollidieren die beiden boxmodelle.

    alternativ kannst du beim firefox noch mit max-height, bzw. max-width tricksen, da IE diese css-befehle nicht kennt.

    edit: mal html im posting deaktivieren. schlimm sowas.

    Einmal editiert, zuletzt von bugcatcher (15. Juni 2005 um 23:18)

    Phu, das war mal eine ausführliche Antwort.
    Ja, wie Ihr schon vermutet habt, habe ich vorhin nach einem Tip eines Freundes eine Lösung gefunden und dann ohnehin alles etwas umgewurschtelt.

    Daher stimmt jetzt die ganze Problembeschreibung nicht mehr, weil wir jetzt ein paar Stunden intensiv dran gebaut haben, so daß das alles jetzt ohnehin ganz anders aussieht.

    Daß height bei table als minimum wirkt, war trotzdem ein sehr wichtiger Hinweis, weil ich an anderen STellen auch ständig solche Probleme habe, das muss ich jetzt anhand Deiner Hinweise, bugcatecher, alles mal durchgehen. Ich denke, dadurch lösen sich ein paar offene Bugs anderswo gleich mit.

    Super gecatched ;)

    Danke für die tolle Erklärung an Euch und viele Grüße,

    Southy