Questione di wrap

**cnc** · 12-08-2007, 14:27

Ho un piccolo dubbio e vorrei sapere da voi se e come sia risolvibile.

Ho il seguente blocco:

codice:

.titolo h2{
	background:url(images/h2_sfondo.gif) repeat-x;
	font-size: 24px;
	line-height: 4em;
	margin: 0;
	padding: 0;
	float: left;
	padding-right: 10px;
}
.titolo img{
	float: left;
}

   <div class="titolo">[img]images/h2_logo.gif[/img]
		<h2>Titolo pagina dsfsdsad</h2>
		[img]images/h2_sfondo_end.gif[/img]</div>

La questione è che rimpicciolendo la finestra del browser il blocco va a capo. Io invece vorrei che i tre elementi (img+h2+img) restassero sulla stessa linea, provocando invece la comparsa della barra di scroll orizzontale del browser.
Ho provato con "nowrap" e con "width/height" ma niente...

grazie

**Myaku** · 13-08-2007, 09:08

width l'hai attribuita al div? in pixel?

**cnc** · 13-08-2007, 17:21

si, al div contenitore... in pixel

**Myaku** · 13-08-2007, 18:29

puoi postare il link alla pagina o il codice completo?

**cnc** · 13-08-2007, 18:37

mi scuso per la lunghezza

codice:

<style type="text/css">
<!--
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 75.01%;
margin:0 auto;
padding:0;
background: #55B9DF;
border-left: 5px solid	#003399;
border-right: 5px solid	#003399;
width: 90%;
}

p {
margin:0;
padding: 0;
}

#pagina {
margin:0 auto;
border-left: 8px solid #FF9900;
border-right: 8px solid #FF9900;
}

#header {
background: #fff url(images/logo.gif) no-repeat;
height: 242px;
}

#logo_up {
height: 69px;
background: url(images/user_pan.gif) repeat-x bottom;
}

#logo_up img{
clear:none;
float:left;
}

#user_pan {
height: 69px;
float:right;
margin-right: 5em;
}

#logo {
height: 120px;
}

#menu {
background: url(images/menu.gif) repeat-x top;
height: 52px;
text-align:right;
font-size: 1.2em;
padding-right: 1em;
margin-left: 190px;
line-height: 1.7em;

}

#quick_menu {
font-variant: small-caps;
}

#quick_menu p{
font-variant: normal;
float:left;
}

#long_menu {
	font-variant: small-caps;
}

#centro {
background: #fff;
}

#destra {
float:right;
width: 230px;
clear:left;
padding-bottom:5em;
background:url(images/sf_destra.gif) no-repeat bottom;
}

#sinistra {
background:#fff url(images/sf_col.gif) repeat-y right top;
margin-right: 230px;
padding-right: 40px;
}

#testo p{
clear:left;
margin-left: 20px;
border-left: 2px dotted #FF9900;
padding-left: 10px;
font-size: 1.4em;
}



#footer {
clear:both;
background: url(images/footer.gif) repeat-x bottom;
height:82px;
}

#footer p{
font-size: 10px;
text-align:center;
padding-top:1em;
}

.titolo{
height:40px;
}

.titolo h2{
	background:url(images/h2_sfondo.gif) repeat-x;
	font-size: 24px;
	line-height: 4em;
	margin: 0;
	padding: 0;
	float: left;
	padding-right: 10px;
}
.titolo img{
	float: left;
}

#sub_cat{
background:url(images/sub_cat.gif) no-repeat top center;
width:210px;
}

#sub_cat h3{
	font-size:20px;
	text-align:center;
	color: #fff;
	font-variant:small-caps;
	margin:0;
padding:15px;
}


#sub_cat ul{
margin:0;
padding-left: 30px;
}

#sub_cat li{
background:url(images/sub_cat_ul2.gif) repeat-y;
font-size: 1.2em;
list-style:none;
padding-left: 15px;
}

#sub_cat li a:hover{
margin-right:29px;
background:url(images/sub_cat_li.gif) right no-repeat;
display:block;
}


.up {
float:left;
clear:left;
margin-left: 20px;
border-left: 2px dotted #FF9900;
border-bottom: 2px dotted #FF9900;
padding-left: 400px;
}

.up a{
text-decoration:none;}

#menu ul{
margin:0;
padding:0;
}

#menu li{
display:inline;
border-right: 1px solid #000;
padding-right: 5px;
}

#menu li a:hover{
background: #fff;
}

-->
</style>
</head>

<body>


<div id="pagina">
	<div id="header">
    	<div id="logo_up">[img]images/logo_up.gif[/img]
        	<div id="user_pan">dasdasd</div>
        </div>
        <div id="logo"></div>
        <div id="menu">
        	<div id="quick_menu">

Sei in Home Page</p>home | forum | chat | contatti</div>
            <div id="long_menu">testo</div>
        </div>
    </div>
    
    <div id="centro">
     <div id="destra">
     
     <div id="sub_cat">
     <h3>sotto-sezioni</h3>
			<ul>
            [img]images/sub_cat_ul1.gif[/img][*]testo[*]testo
            [img]images/sub_cat_ul3.gif[/img][/list]
      </div>  
        
      </div>
     
     <div id="sinistra">
     
	   <div class="titolo">[img]images/h2_logo.gif[/img]
		<h2>Titolo pagina dsfsdsad</h2>
		[img]images/h2_sfondo_end.gif[/img]</div>
        <div id="testo">
        

testo</p>
        <span class="up">torna su</span>
        </div>
               
</div>
<div id="footer"></div>
</div>
</div>

Discussione: Questione di wrap

Strumenti discussione

Ricerca discussione

Visualizza

Questione di wrap

Permessi di invio