• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

nach "display: block" "inline-block" mit 100% width????

B

BettinaSyn

New member
Hallo

Ich möchte gerne an ein Element mit 'display: block' ein weiteres in der selben Zeile anfügen/einfügen, dass automatisch die max. Breite des umgebenden DIV's hat. Leider bekomme ich das nicht hin.

Das habe Ich gemacht...
Wobei .aussen_end als leztes dazu soll und eben die volle Breite bekommen soll. Mit % Angaben bei width landet es aber immer in der nächsten Zeile - auch wenn es eigentlich passen würde. Mit 'em' Angaben ist alles super, aber eben nicht die max. Breite?

Hat jemand vielleicht eine Idee was Ich da machen könnte?

Daaaanke!!!!

#menue .aussen {
float: left;
display: block;
overflow: hidden;
width: 10em;
height: 1.3em;
font-weight: bold;
text-align: center;
padding-top: 3px;
background-color: #FFFFFF;
background-image: url("../Pics/menue_bg.png");
background-repeat:repeat-x;
color: #666666;
border: 1px solid;
border-color: #FFFFFF #CCCCCC #9fb7c3 #9fb7c3;
}

#menue .aussen_end {
float:left;
display:inline-block;
overflow: hidden;
width:100%;
height: 1.3em;
font-weight: bold;
text-align: center;
padding-top: 3px;
background-color: #FFFFFF;
background-image: url("../Pics/menue_bg.png");
background-repeat:repeat-x;
color: #666666;
border: 1px solid;
border-color: #FFFFFF #CCCCCC #9fb7c3 #9fb7c3;
}
 
BettinaSyn schrieb:
Wobei .aussen_end als leztes dazu soll und eben die volle Breite bekommen soll.
Zum Vergrößern anklicken....

Warum muss das zweite Div ein inline-block bekommen? Ich hab jetzt nur in der zweiten Klasse etwas geändert. So ist die Menübreite maßgebend für die Breite des rechten Divs.
PHP: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>zwei divs</title>
<style type="text/css">
#menue .aussen {
float: left;
display: block;
overflow: hidden;
width: 10em;
height: 1.3em;
font-weight: bold;
text-align: center;
padding-top: 3px;
background-color: #FFFFFF;
background-image: url("../Pics/menue_bg.png");
background-repeat:repeat-x;
color: #666666;
border: 1px solid;
border-color: #FFFFFF #CCCCCC #9fb7c3 #9fb7c3;
}
#menue .aussen_end {
margin-left:10.1em;
overflow: hidden;
height: 1.3em;
font-weight: bold;
text-align: center;
padding-top: 3px;
background-color: #FFFFFF;
background-image: url("../Pics/menue_bg.png");
background-repeat:repeat-x;
color: #666666;
border: 1px solid;
border-color: #FFFFFF #CCCCCC #9fb7c3 #9fb7c3;
}
#menue {
background-color: #eee;
width: 55em;
}
</style>
</head>
<body>
	<div id="menue">
		<div class="aussen"></div>
		<div class="aussen_end"></div>
	</div>
</body>
</html>
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben