inline Element akzeptiert width nicht.

Status
Nicht offen für weitere Antworten.

Nord-Süd-Richtung

Erfahrenes Mitglied
Hi

ich möchte gerne das diese spans alle gleichlang haben, damit ich nicht auf eine Tabelle zurückgreifen muss:
HTML:
<div class="ress_div">
      	<div class="ress_outer">
            <span class="ress">Bevölkerung: <? echo number_format($ress["Bevoelkerung"],0,",","."); ?></span>
            <span class="ress">Energie: <? echo number_format($ress["Energie"],0,",","."); ?></span>
         </div>
         <div class="ress_outer">
            <span class="ress">Ress1: <? echo number_format($ress["Res1"],0,",","."); ?></span>
            <span class="ress">Ress2: <? echo number_format($ress["Res2"],0,",","."); ?></span>
         </div>
         <div class="ress_outer">
            <span class="ress">Ress3: <? echo number_format($ress["Res3"],0,",","."); ?></span>
            <span class="ress">Ress4: <? echo number_format($ress["Res4"],0,",","."); ?></span>
         </div>
      </div>
</div>
CSS:
.ress{
	width:250px;
         background-color:#0000FF;
}
.ress_outer{
}
.ress_div{
	margin: -40px 0px 0px 575px;
}

Was muss ich am Code ändern?
 
Hi,

das Inline-Element muß "Block-Level-Charakteristika" erhalten, damit es die width-Deklaration akzeptiert.

Code:
.ress{
width:250px;
background-color:#0000FF;
display:block;
}
mfg Maik
 
Sieht jetzt so aus:
HTML:
      <!-- Ressourcen -->
      <div class="ress_div">
      	<div class="ress_outer">
            <span class="ress_l">Bevölkerung: <? echo number_format($ress["Bevoelkerung"],0,",","."); ?></span>
            <span class="ress_r">Energie: <? echo number_format($ress["Energie"],0,",","."); ?></span>
         </div>
         <div class="ress_outer">
            <span class="ress_l">Ress1: <? echo number_format($ress["Res1"],0,",","."); ?></span>
            <span class="ress_r">Ress2: <? echo number_format($ress["Res2"],0,",","."); ?></span>
         </div>
         <div class="ress_outer">
            <span class="ress_l">Ress3: <? echo number_format($ress["Res3"],0,",","."); ?></span>
            <span class="ress_r">Ress4: <? echo number_format($ress["Res4"],0,",","."); ?></span>
         </div>
      </div>
CSS:
.ress_l{
	float:left;
}
.ress_r{
	float:right;
}
.ress_div{
	margin: -40px 0px 0px 575px;
}
.ress_outer{
}

Aber es ist immer noch nicht das gewünschte Ergebnis zu sehen.
 
Merke: wo float zum Einsatz kommt, ist clear nicht weit entfernt, um den Textfluß unterhalb der Floatumgebung zu erzwingen.

Code:
.ress_outer{
clear:both;
}
mfg Maik
 
Super, Danke

Kannst du mir vielleicht auch hier noch helfen?
HTML:
<li class="navi_outer_link"><span class="navi_link">Übersicht</span></li>
CSS:
.navi_link{
	color:#CCCCCC;
         cursor:pointer;
}
.navi_link:hover{
	color:#FFFFFF;
}
.navi_outer_link, .navi_outer_header{
	display:block;
	width:140px;
         height:30px;
	background-image: url(../pics/Eingabefeld.jpg);
         padding-left:10px;
         padding-top:5px;
}

Der Hovereffekt wird nicht ausgeführt.
 
Laß mich raten: du sprichst hier vom IE<7.

Die Vorgänger der aktuellen Version interpretieren die :hover-Pseudoklasse ausschliesslich für das a-Element.

mfg Maik
 
Im FF 2 + 3, sowie den übrigen standardkonformen Browsern, kann ich da erwartungsgemäß keine Probleme bzw. eine Arbeitsverweigerung der allgemeinen :hover-Pseudoklasse feststellen.

Die Schriftfarbe wechselt auf weiß und der Text verschwindet daraufhin im Weiß des Seitenhintergrundes :)

mfg Maik
 
Status
Nicht offen für weitere Antworten.
Zurück