Css: Unterschied zwischen den Versionen

Aus Vosp.info
Wechseln zu:Navigation, Suche
(float gedöns)
Zeile 32: Zeile 32:
 
</source>
 
</source>
 
=== float gedöns ===
 
=== float gedöns ===
 +
 +
wenn nach dem float gedöns, alles wieder normal weitergehen soll, sprich auch die static positionierung klappen soll .. muss
 +
 +
ansich ist es wohl nur display:block;
 +
 
<source lang="css">
 
<source lang="css">
wenn nach dem float gedöns, alles wieder normal weitergehen soll, sprich auch die static positionierung klappen soll .. muss
+
.main:after{  
.main:after{ display:block; content:"."; clear:both; font-size:0; line-height:0; height:0; overflow:hidden; }
+
display:block;
 +
content:".";  
 +
clear:both;  
 +
font-size:0;  
 +
line-height:0;  
 +
height:0;  
 +
overflow:hidden;  
 +
}
 
</source>
 
</source>

Version vom 18. März 2014, 00:34 Uhr

erstmal lose Notizen !!!!!


Listenelementen

li{
   margin-bottom:20px;               # Abstand zwischen Listenelementen
   list-style-type: none;            # Listen-Punkte nicht anzeigen
}

divs nebeneinander ohne zeilenumbruch

css

div.umschliessendesElement {
	/* bewirkt das die höhe gleich der inhaltshöhe ist */
	display:table; 
	background-color: grey; /* optional */
}
 
div.nebeneinanderstehendesElement{
	/* bewirkt das die elemente nebeneinander stehen und nicht untereinander */
	float: left;
	width: 33%; /* optional */
}

html

<div class="umschliessendesElement">
	<div class="nebeneinanderstehendesElement">hier steht ein text</div>
	<div class="nebeneinanderstehendesElement">hier steht ein text</div>
	<div class="nebeneinanderstehendesElement">hier steht ein text</div>
</div>

float gedöns

wenn nach dem float gedöns, alles wieder normal weitergehen soll, sprich auch die static positionierung klappen soll .. muss

ansich ist es wohl nur display:block;

.main:after{ 
	display:block;  
	content:"."; 
	clear:both; 
	font-size:0; 
	line-height:0; 
	height:0; 
	overflow:hidden; 
}