Visualizzazione dei risultati da 1 a 6 su 6

Hybrid View

  1. #1
    Utente di HTML.it
    Registrato dal
    Jan 2008
    Messaggi
    9

    posizionamento vari DIV

    Buongiorno
    stamattina ho un problema che mi sta facendo impazzire.

    Ho un div, chiamiamolo wrapper x semplicita', con all'interno altri 2 div di dimensioni diverse e affiancati; il primo e' uno slideshow di immagini, il secondo un menu.
    Adesso devo inserire all'interno del primo div un piccolo riquadro con un paragrafo

    </p>. Ho pensato bene di inserire il paragrafo all'interno di un div, e questo div deve essere allineato con l'angolo in alto a destra del div entro cui e' contenuto. Fino alla prima parte (i 2 div affiancati) tutto ok, ma all'inserimento del div col paragrafo, con safari e firefox va bene, indovinate quale browser va a p...ne?!

    Per rendere meglio l'idea di cosa ho fatto vi posto il codice e qualche immagine:

    HTML:
    codice:
    			
    <div class="down">
    	<div class="slideshow">
    		[img]image.png[/img]
    		<div class="payoff">
    			
    
    testo </p>
    		</div>
    	</div>
    	<div id="second_menu">
    		<ul class="menu">
    			[*]item1[/list]
    	</div>
    CSS:
    codice:
    	.down { margin-left:15px; margin-top:10px; float:left; }	
    		.slideshow {
    			max-width:970px;
    			display:inline;
    			float:left;
    			margin-top:0px;
    			padding:0;
    			margin-bottom:0;
    			/*position:relative;
    			z-index:-1;*/
    		}
    		.slideshow .payoff{
    			width:455px;
    			height:40px;
    			position:relative;
    			float:right;
    			margin-top:-40px;
    			margin-right:0px;
    			z-index:100;
    			padding:0;
    			font-style:italic;
    			font-size:20px;
    			background:url(../images/bkg-nivo-desc.png) repeat;
    		}
    		.slideshow .payoff p {
    			width:100%;
    			margin-top:10px;
    			text-align:center;
    			color:#fff;
    		}
    		
    		#second_menu {
    			width:200px;
    			height:230px;
    			float:left;
    			margin-top:0px;
    			/*position:relative;*/
    			/*z-index:-1;*/
    			background:url(../images/bkg-second-menu.png) repeat;
    		}
    		#second_menu ul.menu {
    			list-style-type:none;
    			padding:0;
    			margin-top:0;
    			margin-left:0px;
    		}
    		#second_menu ul.menu li {
    			width:183px;
    			height:20px;
    			margin:0;
    			padding:4px 0;
    			padding-left:15px;
    
    			border-color:#333;
    			border-style:solid;
    			border-left-width:1px;
    			border-right-width:1px;
    			border-top-width:0px;
    			border-bottom-width:1px;
    		}
    La prima immagine e' come vorrei che sia (e come safari e firefox la mostrano):


    La seconda invece e' la visualizzazione exploder style:


    Cosa sto sbagliando?
    Immagini allegate Immagini allegate

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2026 vBulletin Solutions, Inc. All rights reserved.