gestione distanze e margini

[Lup!n]

come si fa a gestire la distanza dai margini per esempio per elementi tipo testo ? o anche tra gli stessi elementi ? ho cercato in giro ma non ho trovato niente.....

[Mich_]

Con i CSS?

C'e` l'attributo padding; in qualche caso si puo` fare anche con il margin; tieni presente che IE non interpreta correttamente il pddding, per cui tanti usano un div dentro l'altro con i margin piuttosto che usare i padding.

Riferimento (ad esempio): http://www.w3schools.com/css/css_reference.asp

[Lup!n]

ti spiego meglio

<div id="sezmenu">

<ul>

<li class="menu">Home
<li class="menu">Articles
<li class="menu">Project
<li class="menu">About


[/list]


</div>

vengono visualizzati quindi dei quadrati e all'interno la parola del menu, volevo sapere come si fa, se si può, a distanziare tale parola dai margini del quadrato

[Mich_]

Originariamente inviato da Lup!n
vengono visualizzati quindi dei quadrati e all'interno la parola del menu, volevo sapere come si fa, se si può, a distanziare tale parola dai margini del quadrato

Questa frase e` un po' sibillina: se postassi anche il CSS relativo forse potremmo capire meglio.

[Lup!n]

hai ragione scusa, provvedo subito:

#sezmenu {
height: 100px;
width:180px;
margin: 1px auto 1px auto;
padding:0;
background:#fff;
float:right;
text-align:center;
border: 1px dotted #fff;
}

#sezmenu ul{margin: 10px 0px 0px 10px;
padding: 0;
list-style: none;
border: 0;}

#sezmenu li{

font-size : 12px;
width: 120px;
margin: 0;
padding: 0;
color: #000;
background: #FFF; }

.menu {
border-top: 1px solid #fff;
border-left: 1px solid #fff;
border-right: 1px solid #fff;

}

#sezmenu li a{
font-size : 10px;
color : #fff;
display: block;
background: #999;
text-decoration: none;
width: 160px;
height : 18px;




}
#sezmenu a:hover{

font-weight: normal;
background-color: #A1D063;
color: #fff;
text-decoration: none;}

[Mich_]

Per i browser conformi al W3C, dovrebbe bastare:
.menu {
border-top: 1px solid #fff;
border-left: 1px solid #fff;
border-right: 1px solid #fff;
padding: 5px 5px 0 5px;
}

Invece se vuoi che funzioni uguale in IE e negli altri, credo che la soluzione sia:
.menu {
border-top: 1px solid #fff;
border-left: 1px solid #fff;
border-right: 1px solid #fff;
}

.menu a {
margin: 5px 5px 0 5px;
}

Ma forse occorre ANCHE far diventare il tag a di tipo blocco, quindi:
.menu a {
display: block;
margin: 5px 5px 0 5px;
}

[Lup!n]

non cambia niente.....

[Lup!n]

up

[carp]

che quadrati vengono visualizzati?

prova così:

#sexmenu ul {
margin: 0;
padding: 0 0 0 10px;
}

#sezmenu li,#sezmenu a{
margin: 0;
padding: 0;
display: block;
}

[Lup!n]

ecco il menu http://xoomer.virgilio.it/1420/, http://xoomer.virgilio.it/1420/prova.css ecco il css, vedete la scritta nel menu ? bene volevo semplicemente sapere come fare a modificare la sua posizione all'interno del quadrato grigio......