css Textausrichtung im Menü

maggie · #1 (**permalink**) 20.05.2009, 12:56

Hallo,
die Textausrichtung (Menüpunkte) der horizontalen Navigation bekomme ich nicht in den Griff - die Menüpunkte stehen zu weit oben.

Die Versuche mit
line-height: 22px;
vertical-align: bottom;
funktionieren nicht

ein padding kommt deshalb nicht in Frage weil sonst die Markierung bei z.B. 'hover' auch nach unten verschoben ist.

Wie bekomme ich die Menüpunkte in die vertikale Mitte des Menüstreifens?
Danke für Eure Hilfe
Gruß
Mac

Code:

.moduletable-haupt ul li {
			font-size:1em;
			line-height: 22px;
			vertical-align: bottom;
			font-weight:bold;
			color: #000000;
			display: inline;
			background-color:#FFFFFF;
			float: right;
			}
			.moduletable-haupt li a {
			height: 22px;
			padding: 0px 8px 0px 10px;
			color: #000000;
			text-decoration: none;
			float: left;
			}
			.moduletable-haupt a:hover {
			height: 22px;
			background-color: transparent;
			background-image: url(../images/hg_m_haupt2.gif);
			background-repeat: repeat-x;
			background-position: 0%;
			color:#FFFFFF;
			text-decoration: none;
			
			}
			.moduletable-haupt li.active {
			height: 22px;
			background-color: transparent;
			background-image: url(../images/hg_m_haupt1.gif);
			background-repeat: repeat-x;
			background-position: 0%;
			color:#FFFFFF;
			text-decoration: none;
			}

fricca · #2 (**permalink**) 20.05.2009, 13:00

Entferne die line-height-Angabe aus dem Universalselektor. Der gilt für alle Elemente -- und macht bei deiner line-height die Vererbung kaputt.

Gib die allgemeine line-height als Faktor für body an.
http://meyerweb.com/eric/thoughts/20...-line-heights/

maggie · #3 (**permalink**) 20.05.2009, 14:43

Super!

Herzlichen Dank fricca!

maggie · #4 (**permalink**) 21.05.2009, 15:59

Hilfe,
jetzt hab ich das Problem mit der Positionierung beim Suchfeld.

die Angabe 'line-height' als Universal-Angabe habe ich ja rausgenommen und in die 'body-Angaben' geschrieben.

Somit müsste die 'line-height' für die '-suche' theoretisch funktionieren?!
Aber leider nein!
Im Firefox hängt der Text ganz oben, im IE ist er mittig, aber die Angabe vertical-align: top; verändert bei IE auch nichts - also nehme ich an, das der IE die Angabe überhaupt nicht interpretiert.

Danke für nochmalige Hilfe.
Gruß, Mac

Code:

div.moduletable-suche {
		height: 22px;
		width : 176px;
		background : #ED6E00;
		padding :0;
		margin: 0;
		float:right;
	
		}
		.inputbox-suche {
			height: 20px;	
			width : 174px;
			background: #ED6E00;
			border: none;
			font-size : 1em;
			font-weight: bold;
			line-height: 20px;
			vertical-align: bottom;
			color:#FFFFFF;
			text-align:center;
			padding :0;
			margin: 0;
	                }

maggie · #5 (**permalink**) 22.05.2009, 12:27

Kann mir jemand weiterhelfen?
Danke!

Gruß, Mac

maggie · #6 (**permalink**) 22.05.2009, 20:50

Ich habe die Positionierung jetzt mit padding-top gelöst - gleichzeitig die 'height' um den padding Pixelwert reduziert.

Code:

height:17px;
padding-top: 3px;

Gruß
Mac

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Problem mit CSS Dropline menü	horst77	CSS	1	12.08.2009 11:49
herunterfahrendes Menü mit CSS	Pablo	CSS	1	27.12.2007 17:07
CSS Menü - Buttonfrage	Ralgar	CSS	6	01.12.2006 17:14
Mysteriöses in CSS Dropdown Menü	ph!L	CSS	3	21.07.2006 12:31
Menü mit CSS aber mit JS Animation?	xy2er	CSS	6	20.03.2005 20:47