|
|
|
![]() |
|
Strumenti |
![]() |
#1 |
Senior Member
Iscritto dal: May 2004
Città: Bologna
Messaggi: 457
|
html+css
Salve a tutti, sto cercando di allineare orizzontalmente 2 div (cioè uno di fianco all'altro), che sono contenuti in un altro div contenitore.
il problema è questo: se utilizzo il float, i div non fanno + allungare lo sfondo della pagina ... se tolgo il float torna tutto normale ma i due div non si mettono sulla stessa linea ma uno sopra l'altro! Vi posto il codice html e quello css: Codice:
<body> <div class="wrapper"> <!-- start wrapper --> <div class="headerconttop"></div> <div class="headercontcenter"> <!-- start contenuti --> <div class="logo">Prova Prova Prova <br />LOGO <br />Fine.<br /></div> <div class="slideshow"><table><tr>SLIDESSHOW</tr></table></div> <div class="test"> <div class="content" style="background-color:green;"> news news news news news<br /> news news news news news news news news news news<br /> news news news news news news news news news news<br /> news news news news news news news news news newsnews news news news news news news news news newsnews news news news news news news news news newsnews news news news news news news news news newsnews news news news news news news news news newsnews news news news news news news news news newsnews news news news news news news news news newsnews news news news news news news news news newsnews news news news news news news news news newsnews news news news news news news news news newsnews news news news news <br /><br /> </div> <div class="box" style="background-color:maroon;"></div> </div> </div> <!-- end contenuti --> <div class="headercontbot"></div> </div> <!-- end wrapper --> </body> Codice:
body { background-image:url('images/stripe_2339d767d057620337b8ebb2e517445e(2).png'); background-repeat:repeat; text-align:center; } div.wrapper { margin:0 auto; width:1024px; padding-top:25px; padding-bottom:5px; position:static; } div.headerconttop { margin:0 auto; width:984px; background-image:url('images/Sezione 5_top.png'); height:30px; } div.headercontcenter { margin:0 auto; width:984px; min-height:500px; background-image:url('images/Sezione 5_bg.png'); background-repeat:repeat-y; } div.headercontbot { margin:0 auto; width:984px; background-image:url('images/Sezione 5_bot.png'); height:30px; } div.logo { text-align:left; margin:0 auto; width:884px; border:1px red solid; } div.slideshow { margin:0 auto; width:884px; height:300px; border:1px black dotted; } div.slideshow table { vertical-align:top; text-align:center; } div.test { margin:0 auto; width:884px; background-color:yellow; } div.content { width:734px; position:relative; left:0px; } div.box { width:150px; min-height:50px; position:relative; left:734px; top:0px; } THX ![]() Ecco cosa accade se nn uso il float: ![]() Ecco cosa accade se uso il float: ![]() Ultima modifica di flikmax : 20-04-2010 alle 13:11. |
![]() |
![]() |
![]() |
#2 |
Senior Member
Iscritto dal: Jul 2009
Città: Varès
Messaggi: 658
|
puoi
• usare i float e dare le dimensioni che vuoi al body, non avendo il restringimento della pagina • non usare i float ma usare dei position: relative; e aggiustarti le posizioni che vuoi per i due div • usare una tabella |
![]() |
![]() |
![]() |
#3 |
Senior Member
Iscritto dal: May 2004
Città: Bologna
Messaggi: 457
|
il problema è ke se metto il float:left, il div non continua a far allungare il div in cui è compreso e che ha il compito di fare allungare lo sfondo in base al contenuto..
ho postato uno screen di come vorrei allineare i 2 box .. edit: ho risolto usando una tabella e dentro i div che mi interessavano! Ultima modifica di flikmax : 20-04-2010 alle 16:19. |
![]() |
![]() |
![]() |
Strumenti | |
|
|
Tutti gli orari sono GMT +1. Ora sono le: 08:50.