allineamento immagine e testo, padding larghezza e float

  • Creatore Discussione Creatore Discussione ntoflip
  • Data di inizio Data di inizio

ntoflip

Utente Attivo
26 Ago 2008
50
0
0
Per questo codice devo utilizzare per forza di cose i css inline e ho dei problemi ad ottenere quello che voglio..
Ho un div container largo 400px all'interno del quale voglio inserire un'immagine larga la metà affiancata con un margine di 10px un div largo 190 con del testo dentro che abbia un padding di 10.
A parte tutti i problemi legati alla compatibilità cross-browser, hackeraggi e tutto quanto, il codice di sotto viene visualizzato in una maniera che non riesco proprio a capire.. L'ho testato su firefox , safari e IE5.2 per mac (n è il massimo ma è quello che ho..).
La cosa strana è che il div in firefox e safari, che visualizzano in modo identico, il div mi finisce completamente sotto l'immagine, anche rispettando la somma tra padding e width, anche in IE finisce parzialmente sotto l'immagine ma in più mi sposta leggermente l'immagine di 2-3px verso destra come se avesse un margine.. ma togliendo il float si allinea perfettemante a destra solo che poi il div finisce al rigo sotto.. nsomma non ci sto capendo niente

Codice:
<div style='width: 400px; margin-top:2px; background-color:#ffff00'>
  <img src='immagine.jpg' style='display:block; float:left'/>
  <div style='background-color:#D1D4D3; width:190px; height:160px; margin-left:10px;  padding:10px'>
      <div>Bla bla</div>
  </div>
</div>
 
ciao
ff ecc interpretano il box in modo diverso da ie5, in pratica la larghezza totale interpretata da ff è width+margin-padding, in ie5 la larghezza totale è width margin e padding sono all'interno.
io per evitare non utilizzo margin e paddin e do le posizioni in px
 
era tutto un problema di float..

Grazie borgo per la risposta ma stamattina ho risolto semplicemente aggiungendo dei float:left un po' dappertutto.. purtroppo poi graficamente nel contesto non mi piaceva il risultato e ho buttato via quel codice e ora non posso postarlo.. sorry
 

Discussioni simili