CSS 4 mal 2 LIs/DIVs nebeneinander und untereinander

Mr. Snoot · 7. Juli 2011

Kann mir noch jemand verraten, wie ich es Opera Mobile beibringen, einen Link in einer Tabellenzelle vertikal zu zentrieren, wenn ich diesen mit display:block anzeigen lasse? Egal was ich tue, er klebt am oberen Zellenrand

(abgesehen davon, dass er auch nicht auf die Schriftformate reagiert ...). Hab schon mit margin, line-height & Co. gespielt aber leider keinen Erfolg gehabt.

Links Browser XY - rechts Opera Mobile

http://m.halbleiter.org/td.php

51% · 7. Juli 2011

vertical-align:middle schon ausprobiert?

Mr. Snoot · 8. Juli 2011

Jo, hilft nicht.

Adem67 · 8. Juli 2011

Haben deine Zellen eine feste Höhe? Normalerweise macht man das so (als Beispiel):

Code:

td {
    height: 50px;
    line-height: 50px;
}

Table für ein Menü ist nicht semantisch. Teste doch mal folgenden Code in Opera:

Code:

<!doctype html>

<html lang="de">
	<head>
		<meta charset="utf-8" />
		<title>Zweispaltige Liste</title>
		<style>
			ul {
				margin: 0;
				padding: 0;
			}
			li {
				display: block;
				float: left;
				width: 120px;
				height: 40px;
				line-height: 40px;
				text-align: center;
				background: #ff8000;
				padding: 5px;
				margin: 1px;
				color: #fff;
				border-radius: 3px;
			}

			li:nth-child(odd) {
				clear: left;
			}
		</style>
	</head>
	<body>
		<ul>
			<li>1</li>
			<li>2</li>
			<li>3</li>
			<li>4</li>
			<li>5</li>
			<li>6</li>
		</ul>
	</body>
</html>

Mr. Snoot · 8. Juli 2011

Ergibt im Grunde dasselbe Problem

Die Zellen habe eine fixe Höhe; ich hatte das line-height allerdings immer dem Link zugewiesen. Wenn ich es der Zelle zuweise, scheint es zu funktionieren. Allerdings nur, solange ich dem Link nicht 100% Höhe und Breite zuweise. Das scheint aber alle anderen Browser nicht daran zu hindern, den Link mit display:block trotzdem auf die ganze Zelle auszudehnen; Opera tut das nicht, aber das ist mir jetzt auch egal, wenn der so doof ist

Belee · 8. Juli 2011

51% schrieb:
weil man es nicht braucht. blöd nur, wenn man darunter einen selektor neu ans ende setzt und das fehlende semikolon vergessen hat. deshalb hintippen und gut isses.

Mr. Snoot schrieb:
Jo, aber es klang so, als ob das irgendwelche "Vorteile" hätte.

Hat es auch, korrekter und sauberer Code. Wenn dich das aber nicht interessiert kannst du es natürlich drin lassen

Es schadet nicht, ausser das du dann pro Klasse, ID ein überflüssiges Zeichen in der Stylesheet hast, mal 100 Klassen/IDs macht das 100 Zeichen. Mit 100 Zeichen lassen sich aber min. 3 weitere kleinere Klassen definieren die dann Sinn machen, das " ; " 100 mal aber eben nicht, genauso wie wenn man mit DIVs eine Tabelle nachahmen will.

@Yuri
Dann suche mal via Google, die Liste ist sehr lang. Ich habe jetzt keine Lust dir alle Browser hier zu nenen. Ich denke aber das ist eh zwecklos. Macht es so wie ihr es halt meint, und wenn ihr meint ihr müsst Leute mit alten Browsern bestrafen dann tut das. Aber nur eine Sache, nicht jeder darf/kann oder will immer das neuste nutzen. Ausserdem, zum Webdesign gehört auch etwas mehr als eine Seite nur für FF oder Chrome zu schreiben. Klar ist das alles mehr Code, mehr Nerven und mehr graue Haare gibt das auch, aber das ist Webdesign.

Suche

CSS 4 mal 2 LIs/DIVs nebeneinander und untereinander

Mr. Snoot

Gast

51%

Cadet 4th Year

Mr. Snoot

Gast

Adem67

Lieutenant

Mr. Snoot

Gast

Belee

Lt. Commander

Ähnliche Themen