disposizione div con sfondo spostato

**Jason** · 02-06-2011, 12:26

ciao, allego un immagine così si capisce quello che scrivo

ho creato il div con sfondo giallo e una scritta all'interno, posizione absolute per poterlo posizionare...ma perchè il testo rimane fuori dal rettangolo?

codice:

<body>
		<div id="boxcontenitore">
			<div id="boxlogo2">
				[img]images/logo.png[/img]
			</div>
			<div id="titolo"><p class="tit">IMPIANTI</p>
			</div>
			<hr class="hr1" color="rgb(0,121,191)" />
			<div id="boxmenu">
				<div id="navigation">
					<ul>
						[*]Home Page
						[*]Settori
						[*]Dove Siamo
						[*]Contatti
						[*]Preventivo
						[*]TV e PC
					[/list]
				</div>
			</div>

			<div id="boxtesto-s-1"><p class="scr1">Installazione di impianti elettrici in tutti i settori: civili, commerciali e industriali con materiali di ottima qualità e criteri d’installazione volti a soddisfare tutte le vigenti normative e le numerose e diversificate esigenze del cliente finale.</p>
									
<p class="cos">Pagina in costruzione</p>
									
<div id="imp01">[img]images/imp02.jpg[/img]</div>
									<div id="imp02">[img]images/imp01.jpg[/img]</div>
									<div id="imp03">[img]images/imp03.jpg[/img]</div>
			</div>
	</body>

e css

codice:

body {background:rgb(0,121,191);margin: 25px 80px;}

.hr1 {float:left; height: 2px; width:100%; color:rgb(0,121,191);}

img#logo {width: 190px;height: 90px;margin: 0;}

#boxcontenitore {width:1100px; height:1000px; border:0; margin:auto; background-color:rgb(193,210,215); padding:10px 0 0 0;}
#boxtesta {width: 470px; height: 90px; border: 0px solid red; padding: 5px; margin-left: 150px; float: left;}
#boxlogo2 {width: 190px; height: 90px; border: 0px solid; padding: 5px; margin-left: 120px; margin-top:0px; float: left;}
#boxmenu {width: 200px; border: 0px solid; padding-top: 50px; margin-left: 20px; float: left;}

#boxtesto-s-1 {width: 860px; border: 0px solid blue; float: left; margin-left: 5px; margin-top:-1px;}
#imp01 {margin-left:10px; margin-top:33px; float:left;}
#imp02, #imp03 {margin-left:40px; float:left;}
#imp03 {margin-top:33px;}
p.cos {font:14px Arial, Verdana; text-align:center; color:red;}

#titolo {width:350px; height:70px; background-color:yellow; position:absolute; padding:0; margin:0; margin-left:550px; margin-top:60px;}
.tit {font: 45px "Arial black", verdana;}

grazie

**Jason** · 03-06-2011, 20:33

nessuno sa aiutarmi??

**skjobax** · 04-06-2011, 11:24

Non noto errori nel CSS... sto provando il codice sul mio PC...

**skjobax** · 04-06-2011, 11:31

OK, il testo entra nel box giallo SOLO se levi di mezzo il position absolute alla classe di stile per #titolo!
Testato con Firefox 4.01

codice:

#titolo {
    background-color: yellow;
    height: 70px;
    margin: 60px 0 0 550px;
    padding: 0;
    width: 350px;
}

**Jason** · 04-06-2011, 11:51

ma senza position:absolute riesco lo stesso a posizionarlo in un punto preciso della pagina???

**skjobax** · 04-06-2011, 15:45

No.
Prova con position relative ma a me quando ho tolto il position è rimasto lì...

Discussione: disposizione div con sfondo spostato

Strumenti discussione

Ricerca discussione

Visualizza

disposizione div con sfondo spostato

Permessi di invio