Ripezione immagine non voluta

**robot_dika** · 06-06-2006, 14:51

Ciao a tutti, nei giorni scorsi ho postato per chiedere informazioni su come utilizzare un design .tif per un sito, mi e' stato consigliato di studiare i css e il linguaggio xhtml. Ho studiato su xhtml.html.it e css.html.it e adesso sono alle prese con il mio primo css. Ho un problema:

devo creare lo sfondo al menu e questo sembra funzionare, quando inserisco il primo bottone non ci sono problemi, imposto i margini e tutto, ma appena inserisco il secondo bottone questo viene inserito a casaccio sovrapposto a una ripetizione non voluta del primo bottone..

spero di essere compreso. Posto di seguito anche il mio css e parte del codice xhtml:

body {
background :#8E8569;
color : #8E8569;
font : 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
margin : 0px;
padding-bottom : 0px;
padding-left : 0px;
padding-right : 0px;
padding-top : 0px;
text-align : center;
}

#test{
background: #8E8569;
color : #000000;
margin : 20px auto;
text-align : left;
width : 800px;
}

#testata {
background : url(images/I1.bmp);
height : 75px;
margin : 0px;
padding-bottom : 0px;
padding-left : 26px;
padding-right : 26px;
padding-top : 0px;
}

#foto {
background : #8E8569;
height : 125px;
margin : 0px;
padding-bottom : 1px;
padding-left : 0px;
padding-right : 0px;
padding-top : 10px;
}

#centrale {
background: url(images/I3.bmp);
color : #000000;
margin : 0px auto;
text-align : left;
height : 345px;
}

#menu1 {
background: url(images/menu1.bmp);
margin :45px 30px;
height : 260px;
width : 180px;
}

#menu2 {
background: url(images/menu2.bmp);
margin :45px 260px;
height : 260px;
width : 180px;
}

================================================== =========

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>prova</title>
<link type="text/css" rel="stylesheet" href="style.css" />
</head>
<body>

<div id="test">
<div id="testata">[img]logo.bmp[/img]</div>

<div id= "foto">[img]foto.bmp[/img]</div>

<div id="centrale">
<div id="menu1">
<div id="menu2">

</div>
</body>
</html>

================================================== ============

grazie infinite per l'aiuto..

**Mich_** · 06-06-2006, 15:37

I due blocchi verrannoposizionati uno sotto l'altro, avvicinati al bordo sinistro del blocco body, con i margini e padding impostati.

Pero` i padding usati cosi` mi sembrano non corretti (dal punto di vista estetico): forse sono i vari padding che ti scombussolano il tutto

**robot_dika** · 06-06-2006, 16:15

Originariamente inviato da Mich_
I due blocchi verrannoposizionati uno sotto l'altro, avvicinati al bordo sinistro del blocco body, con i margini e padding impostati.

Pero` i padding usati cosi` mi sembrano non corretti (dal punto di vista estetico): forse sono i vari padding che ti scombussolano il tutto

e come devo fare per mettere i due blocchi uno accanto all'altro e non uno sotto l'altro distanziati di qualche px??

grazie

**Mich_** · 06-06-2006, 16:26

Per inserire dei blocchi sulla stessa "riga", devi renderli flottanti

codice:

#testata {
  float: left;
  background : url(images/I1.bmp);
  height : 75px;
  margin : 0;
  padding: 0 26px;
}

#foto {
  float: left; /* oppure right, se preferisci lasciare spazio inmezzo */
  background : #8E8569;
  height : 125px;
  margin : 0;
  padding: 10px 0 1px;
}

Ancora credo che i padding non siano il massimo, ma regolali secondo il tuo gusto.

L'ordine dei valri nel padding:
4 valori: top right bottom left;
1 valore: tutti i bordi uguali;
2 valori: top=bottom left=right;
3 valori: top right=left bottom;

**robot_dika** · 06-06-2006, 16:48

Ancora credo che i padding non siano il massimo, ma regolali secondo il tuo gusto.

Grazie del consiglio e dell'aiuto, piano piano imparo anche io :maLOL:

Discussione: Ripezione immagine non voluta

Strumenti discussione

Ricerca discussione

Visualizza

Ripezione immagine non voluta

Permessi di invio