CSS: margins nur zwischen floats

watchout

Legend
undead

Registered: Nov 2000
Location: Off the grid.
Posts: 6845

03.06.2009 - 00:58

pff, fixe Breite, CSS UND auch noch IE kompatibel... was stellst du für Anforderungen

Spikx

My Little Pwny

Registered: Jan 2002
Location: Scotland
Posts: 13504

03.06.2009 - 01:00

Na, inline-block ist doch nix.

das margin-right wirkt sich immer noch zwischen Elternelement und dem inline-block Element aus (somit sind wir wieder am Anfang)
und es besteht weiterhin das Problem, dass Zeilenumbrüche zwischen den inline-block Elementen in einen Space zwischen den Elementen resultieren.

watchout

Legend
undead

Registered: Nov 2000
Location: Off the grid.
Posts: 6845

03.06.2009 - 01:01

Was is das Problem beim 2., das hört sich doch eh sehr auto-generiert an, lässt man halt die spaces weg?

e: zu 1. ja sowas ich hab das echt nicht getestet, entweder hab ich die specs falsch im kopf oder ff pfuscht...

watchout

Legend
undead

Registered: Nov 2000
Location: Off the grid.
Posts: 6845

03.06.2009 - 01:05

Was brauchst denn genau, weil sonst könntest den whitespace ausnutzen zb: wie hier

Code:

<html>
	<head>
		<style type="text/css">
div {
	border:1px solid red;
}
.a {
	display:inline-block;
	/*margin-right: 5px;*/
	min-width: 100px;
}
.b {
	width:300px;
}
.c {
	padding:0;
}
		</style>
	</head>
	<body>
		<div class="c">
			<div class="a"><div class="b">asdf</div></div>
			<div class="a"><div class="b">asdf</div></div>
			<div class="a"><div class="b">asdf</div></div>
			<div class="a"><div class="b">asdf</div></div>
		</div>
	</body>
</html>

Spikx

My Little Pwny

Registered: Jan 2002
Location: Scotland
Posts: 13504

03.06.2009 - 01:06

Zitat von watchout
Was is das Problem beim 2., das hört sich doch eh sehr auto-generiert an, lässt man halt die spaces weg?

Jo, man müsste halt darauf achten, dass man keinen whitespace dazwischen hat. Kann halt unschön sein, vom code/template her.

Zitat von watchout
Was brauchst denn genau, weil sonst könntest den whitespace ausnutzen zb: wie hier

Naja, auf den whitespace verlassen will ich mich nicht und man will ja evt. auch einen variablen margin dazwischen haben

. Und ich suche halt eine allgemeine Lösung für das Problem, ohne Javascript. Und ohne Javascript würde mir momentan nur eine sehr hässliche table einfallen. Ohne cellpadding und cellspacing, dafür mit rows und columns, vielleicht sogar mit noch hässlicheren spacer gifs :P, die den margin dazwischen repräsentieren. Brr.

Bearbeitet von Spikx am 03.06.2009, 01:08

watchout

Legend
undead

Registered: Nov 2000
Location: Off the grid.
Posts: 6845

03.06.2009 - 01:11

probier mal

Code:

<html>
	<head>
		<style type="text/css">
div {
	border:1px solid red;
	word-spacing: 5em;
}
.a {
	display:inline-block;
	min-width: 100px;
}
.b {
	width:300px;
	word-spacing: 0;
}
.c {
	padding:0;
}
		</style>
	</head>
	<body>
		<div class="c">
			<div class="a"><div class="b">asdf jklö</div></div>
			<div class="a"><div class="b">asdf jklö</div></div>
			<div class="a"><div class="b">asdf jklö</div></div>
			<div class="a"><div class="b">asdf jklö</div></div>
		</div>
	</body>
</html>

ohne css 2.1 wirds wohl auf keinen fall was fürcht ich

Spikx

My Little Pwny

Registered: Jan 2002
Location: Scotland
Posts: 13504

03.06.2009 - 01:16

Jo, mit word-spacing könnte man dann mit dem whitespace den "margin" genauer definieren, stimmt. Aber für den vertikalen margin hätte man dann wieder nichts.

Ich find's interessant, dass es für sowas einfach nix gscheits gibt. Auch nicht mit CSS 2.1

. Und mehrere Elemente pass-genau in ein anderes Element zu geben, mit margins dazwischen ist doch nichts abwegiges?

watchout

Legend
undead

Registered: Nov 2000
Location: Off the grid.
Posts: 6845

03.06.2009 - 01:23

Wie gesagt, vertikal müsste mit line-height zu bewältigen sein, durch inline-box kannst du ja sozusagen jede einzelne box als "wort" ansehen, bzw <img> weil das kommt dem am nächsten (man kann die dimensionen festlegen!), und daher auch die jeweiligen CSS properties verwenden.

Ich für meinen Teil find den Anwendungsfall etwas kryptisch was die vertikale Sache angeht, weil unterer margin meistens eher uninteressant ist, die Sache mit L/R margins find ich äußerst interessant, irgendwann hab ich vielleicht dann auch mal Verwendung dafür

So, ich geh jetzt jedenfalls in die Falle

Spikx

My Little Pwny

Registered: Jan 2002
Location: Scotland
Posts: 13504

03.06.2009 - 01:32

Hm.. warum kryptisch? Wenn du jetzt zB Bilder einer Gallerie oder whatever, in einer fixen Box anzeigen lassen willst, aber der Optik wegen natürlich margins dazwischen haben willst, in jede Richtung zwischen den einzelnen Bildern. Also auch vertikal.

Warum ist unterer margin meistens uninteressant?

watchout Legend undead Registered: Nov 2000 Location: Off the grid. Posts: 6845	03.06.2009 - 00:58 pff, fixe Breite, CSS UND auch noch IE kompatibel... was stellst du für Anforderungen
Spikx My Little Pwny Registered: Jan 2002 Location: Scotland Posts: 13504	03.06.2009 - 01:00 Na, inline-block ist doch nix. das margin-right wirkt sich immer noch zwischen Elternelement und dem inline-block Element aus (somit sind wir wieder am Anfang) und es besteht weiterhin das Problem, dass Zeilenumbrüche zwischen den inline-block Elementen in einen Space zwischen den Elementen resultieren.
watchout Legend undead Registered: Nov 2000 Location: Off the grid. Posts: 6845	03.06.2009 - 01:01 Was is das Problem beim 2., das hört sich doch eh sehr auto-generiert an, lässt man halt die spaces weg? e: zu 1. ja sowas ich hab das echt nicht getestet, entweder hab ich die specs falsch im kopf oder ff pfuscht...
watchout Legend undead Registered: Nov 2000 Location: Off the grid. Posts: 6845	03.06.2009 - 01:05 Was brauchst denn genau, weil sonst könntest den whitespace ausnutzen zb: wie hier Code: `<html> <head> <style type="text/css"> div { border:1px solid red; } .a { display:inline-block; /margin-right: 5px;/ min-width: 100px; } .b { width:300px; } .c { padding:0; } </style> </head> <body> <div class="c"> <div class="a"><div class="b">asdf</div></div> <div class="a"><div class="b">asdf</div></div> <div class="a"><div class="b">asdf</div></div> <div class="a"><div class="b">asdf</div></div> </div> </body> </html>`
Spikx My Little Pwny Registered: Jan 2002 Location: Scotland Posts: 13504	03.06.2009 - 01:06 Zitat von watchout Was is das Problem beim 2., das hört sich doch eh sehr auto-generiert an, lässt man halt die spaces weg? Jo, man müsste halt darauf achten, dass man keinen whitespace dazwischen hat. Kann halt unschön sein, vom code/template her. Zitat von watchout Was brauchst denn genau, weil sonst könntest den whitespace ausnutzen zb: wie hier Naja, auf den whitespace verlassen will ich mich nicht und man will ja evt. auch einen variablen margin dazwischen haben . Und ich suche halt eine allgemeine Lösung für das Problem, ohne Javascript. Und ohne Javascript würde mir momentan nur eine sehr hässliche table einfallen. Ohne cellpadding und cellspacing, dafür mit rows und columns, vielleicht sogar mit noch hässlicheren spacer gifs :P, die den margin dazwischen repräsentieren. Brr. Bearbeitet von Spikx am 03.06.2009, 01:08
watchout Legend undead Registered: Nov 2000 Location: Off the grid. Posts: 6845	03.06.2009 - 01:11 probier mal Code: `<html> <head> <style type="text/css"> div { border:1px solid red; word-spacing: 5em; } .a { display:inline-block; min-width: 100px; } .b { width:300px; word-spacing: 0; } .c { padding:0; } </style> </head> <body> <div class="c"> <div class="a"><div class="b">asdf jklö</div></div> <div class="a"><div class="b">asdf jklö</div></div> <div class="a"><div class="b">asdf jklö</div></div> <div class="a"><div class="b">asdf jklö</div></div> </div> </body> </html>` ohne css 2.1 wirds wohl auf keinen fall was fürcht ich
Spikx My Little Pwny Registered: Jan 2002 Location: Scotland Posts: 13504	03.06.2009 - 01:16 Jo, mit word-spacing könnte man dann mit dem whitespace den "margin" genauer definieren, stimmt. Aber für den vertikalen margin hätte man dann wieder nichts. Ich find's interessant, dass es für sowas einfach nix gscheits gibt. Auch nicht mit CSS 2.1 . Und mehrere Elemente pass-genau in ein anderes Element zu geben, mit margins dazwischen ist doch nichts abwegiges?
watchout Legend undead Registered: Nov 2000 Location: Off the grid. Posts: 6845	03.06.2009 - 01:23 Wie gesagt, vertikal müsste mit line-height zu bewältigen sein, durch inline-box kannst du ja sozusagen jede einzelne box als "wort" ansehen, bzw <img> weil das kommt dem am nächsten (man kann die dimensionen festlegen!), und daher auch die jeweiligen CSS properties verwenden. Ich für meinen Teil find den Anwendungsfall etwas kryptisch was die vertikale Sache angeht, weil unterer margin meistens eher uninteressant ist, die Sache mit L/R margins find ich äußerst interessant, irgendwann hab ich vielleicht dann auch mal Verwendung dafür So, ich geh jetzt jedenfalls in die Falle
Spikx My Little Pwny Registered: Jan 2002 Location: Scotland Posts: 13504	03.06.2009 - 01:32 Hm.. warum kryptisch? Wenn du jetzt zB Bilder einer Gallerie oder whatever, in einer fixen Box anzeigen lassen willst, aber der Optik wegen natürlich margins dazwischen haben willst, in jede Richtung zwischen den einzelnen Bildern. Also auch vertikal. Warum ist unterer margin meistens uninteressant?

CSS: margins nur zwischen floats

Forum Index > Software > Coding Stuff

watchout

Spikx

watchout

watchout

Spikx

watchout

Spikx

watchout

Spikx