FinnO - Fr 18.01.13 16:44
Titel: Korrekte Höhenangabe für <menu>-Element

---

Moin,

muss man warme Worte finden, wenn man den ersten Thread in einem Unterforum eröffnet? Mir fallen keine ein.

Ich baue mir gerade ein Dropdown-Menü mit reinem HTML5 und CSS, dabei gehe ich im wesentlichen nach dieser [http://line25.com/tutorials/how-to-create-a-pure-css-dropdown-menu] Anleitung vor. Das ganze Menü funktioniert auch wie gewünscht, jedoch wird der <menu>-Tag erstens in unterschiedlichen Browsern unterschiedlich hoch und zweitens höher als das beinhaltete Element gerendert.

Zum selber Angucken und Firebuggen, habe ich die Datei hier [http://development.fopdev.de/dropdown_vorlage_ee.html] hochgeladen.

Hier einmal ein paar Beispiele als Bilder:

Darstellung im Firefox:


Darstellung in Chrome:


Gewünschte Darstellung [Fixe Höhe 34px in Firefox, man beachte: Chrome zeigt keinen Rand mehr an, wenn die Höhe 32px beträgt.]


Hat jemand Ideen, wie ich den grauen Rand wegbekomme?

LG

Christian S. - Fr 18.01.13 19:17

---

Wenn ich bei menu ul das display: inline-block deaktiviere, sieht es bei mir in Chrome, Waterfox und IE gut aus.

FinnO - Sa 19.01.13 15:01

---

Hallo Christian,

das behebt bei mir das Problem nur in Firefox, nicht jedoch in Chrome. Danke trotzdem schoneinmal für deine Hilfe :)

LG

Regan - Sa 19.01.13 15:04

---

Also bei mir sieht das im Chrome (24) perfekt aus:

FinnO - Sa 19.01.13 15:49

---

Moin Regan,

das ist in der Tat merkwürdig. Tatsächlich wird das Element bei mir auch korrekt dargestellt, wenn ich den display-style mit Firebug unter Chrome deaktiviere. Nehme ich die entsprechende Zeile jedoch aus der css-Datei, stellt lediglich Firefox das Element korrekt dar. Verrückt! :shock:

EDIT: ich nehme alles Zurück und behaupte das Gegenteil. Hatte noch den 34px height fix drinne! :oops: :oops:

LG