ciao a tutti è la prima volta che provo a strutturare un layout interamente in css e come potete immaginare ho un po' di problemi.
in seguito incollerò il css..il problema è che vorrei che il testo presente nelle varie colonne iniziasse un px dopo il bordo che lo precede..ho provato in tutti i modi ma senza successo.
qualcuno mi saprebbe dire per cortesia come si fa, se è possibile, ad inserire due immagini consecutivamente o una sopra ed una sotto in una colonna ?
essendo abituato alle tabelle il titolo del sito ad esempio lo suddividevo in 2 o più jpeg tanto per rendere l'idea..
ecco il css:
#testa {
width:90%;
margin:1em auto;
}
#testa img { display:block }
#testa {
border:1px solid #000;
padding:1em 0;
background-position: left;
background-image: url(jpg/titolo.jpg);
background-attachment: scroll;
background-repeat: no-repeat;
height: 71px;
text-align: left;
background-color: #006600;
border-bottom-color: #339900;
}
#corpo-titolo1 {
position:absolute;
top:20px;
left:0px;
background-color: #006600;
background-position: left;
background-image: url(jpg/titolo.jpg);
background-attachment: scroll;
background-repeat: no-repeat;
width:387px;
padding:0em 0;
height: 66px;
border-bottom-color: #339900;
}
#corpo-titolo2 {
margin:0 100px 0 387px;
border-left:1px solid #000;
border-right:1px solid #000;
background:#fff;
padding:1em 0;
background-color: #336633;
}
#corpo-titolo3 {
position:absolute;
top:0; right:0;
width:100px;
padding:1em 0;
}
#corpo-colonna1 {
position:absolute;
top:0; left:0;
width:160px;
padding:1em 0;
}
#corpo-colonna2 {
margin:0 223px 0 162px;
border-left:1px solid #000;
border-right:1px solid #000;
}
#corpo { width:90%; margin:1em auto ; text-align:left }
#corpo {
position:relative;
border:1px solid #000;
background-color: #336633;
}
body {
text-align:left;
font:80% verdana,helvetica,sans-serif;
margin:0;
padding:0;
color: #66CC00;
}
code {
font:80% verdana,helvetica,sans-serif;
display:block;
margin:0 1em .5em 1em;
}
hr { display:none }
#corpo-colonna3 {
position:absolute;
top:0;
right:0;
width:220px;
padding:1em 0;
background-image: url(jpg/iris/titolo_iris.jpg);
background-repeat: no-repeat;
background-position: top;
text-align: justify;
background-color: #66CC00;
}
#piedipagina { width:90%; margin:1em auto; text-align:left }
#piedipagina {
background:#eee;
border:1px solid #000;
padding:1em 0;
}

Rispondi quotando