ciao.vorrei creare un effetto ombra sul mio sito che si sviluppa con un div centrale suddiviso in 2 colonne con intestazione e pie pagina.
vorrei un leggera ombra creata dal corpo centrale del mio sito sullo sfondo.
come devo fare?
ciao.vorrei creare un effetto ombra sul mio sito che si sviluppa con un div centrale suddiviso in 2 colonne con intestazione e pie pagina.
vorrei un leggera ombra creata dal corpo centrale del mio sito sullo sfondo.
come devo fare?
2 colonnine laterali con lo sfondo fatto da un'ombra ripetuta verticalmente...
cioè?
In pratica è la stessa tecnica usata questo forum (sposta lo sguardo a sx o a dx)... vedi il codice...Originariamente inviato da kevin0101
cioè?
puoi creare una gif singola ripetuta verticalmente larga quanto il contenitore + l'ombra.
se il contenitore è 760px, ne crei una di 770px che metterai come sfondo nel contenitore padre...
es.
#container
{
background: #fff url(sfondo.gif) repeat-y;
width: 770px;
}
#content
{
width: 760px
}
spero di essermi spiegato...
This is not mission difficult, Mr. Hunt... It's mission impossible.
si, senti io ho provato, la mia situazione è diversa dal tuo codice ma potrebbe andare, però non si vede nulla, ti posto il mio codice.
<div id="centrato">
<div id="intestazione">
[img]spikeintestazione2.jpg[/img]
<hr>
<ul class="menuNavigazione"><li class="primaVoce">Home<li class="voceCorrente">Circolo Culturale[*]Ludoteca[*]Calendario Eventi[*]Negozio[*]Dove Siamo[*]Contatti[/list]
<hr>
</div>
<div id="corpo">
<div id="colonna-1">
<div class="boxArrotondato">
<h1>Fun Area</h1>
<ul>
[*]Fotogallery
[*]Forum
[*]Weblog
[*]Recensioni
[*]Guestbook
[/list]
</div>
in pratica ho un div centrato dentro il quale un div corpo suddiviso in 2 colonne (altri 2 div)
io il tuo codice l ho messo al div centrato in questa maniera:
body {
margin: 0;
padding: 0;
text-align: center;
background:#98b;
color: #000;
font: 80% papyrus,Verdana, Geneva, Arial, Helvetica, sans-serif;
}
#centrato {
width:800px;
background:#fff url(ombra.jpg) repeat-y;
margin:auto;
text-align: left;
}
#corpo {
float:left;
width: 800px;
background: #FFF url(sfondo.3col.fisso.gif) 0 0 repeat-y;
}
#colonna-1 {
float:left;
width:200px;
background:#42A62A;
color: #000;
}
#colonna-2 {
float:left;
width:600px;
background: transparent;
color: #000;
}
#intestazione {
background: #42A62A;
color: #fff;
}
#pie-di-pagina {
clear: left;
background: #42A62A;
color: #fff;
}
ho fatto un immagine lunga 850px e alta 50px
cosa c'è che non va?
#centrato {
width:800px;
background:#fff url(ombra.jpg) repeat-y;
margin:auto;
text-align: left;
}
se l'immagine è di 850px allora il valore di width deve corrispondere altrimenti è per quello che nn vedi nulla... poi 50px in altezza per l'img mi sembrano un pò troppi... se lo sfondo è di 1 solo colore ti bastano 5px e ci guadagni in termini di peso...
This is not mission difficult, Mr. Hunt... It's mission impossible.
credo che la soluzione ai tuoi problemi possa essere:
codice:Codice CSS #contain-one { padding: 0 0 0 69px; min-width: 650px; background: #fff url(img/bshad_left.gif) repeat-y; } #contain-two { padding: 0 69px 20px 0; background: #fff url(img/bshad_right.gif) repeat-y top right; height: 900px; }Ovviamente le immagini le devi creare tu; in linea di principio delle immagini 69px per 20px vanno più che bene!codice:Codice XHTML <body> <div id="contain-one"><div id="contain-two"> Contenuto della pagina, Lorem ipsum ect...</p> </div></div> </body>
Sickbrain.org » A proposito di Web Publishing
Permessi di invio
Rispondi quotando