Linea orizzontale con CSS

**sevenumber** · 13-03-2006, 12:41

Premetto che mi sono da poco affacciato al mondo sui fogli di stile e subito, come prevedibile, sn incappato in qualche problema, lo espongo:

ho creato questa pagina

<style type="text/css">

</style>

***********************

<body>

<div id="header">
<code>www.miosito.com</code>
<code>line</code>

<hr />

<div id="corpo">
<code>#corpo { width:90%; margin:1em auto; text-align:left }</code>
<code>#corpo {
background:#ccc;
border:1px solid #000;
padding:1em 0;
}</code>
</div>

<hr />

<div id="footer">
<code>line</code>
<code>link A | link B | link C | link D | link E </code>
<code>line</code>
</div>

</body>

vorrei che al posto di "line" ci fosse una bella linea orizzontale rimanendo inserita nell'"header" ma anche utilizzabile nel "footer" ... COME FARE?

**Federix** · 13-03-2006, 13:01

Io non ho capito niente di quello che chiedi però ti consiglio di fare così: dichiari, nel foglio di stile, il tag hr:

codice:

hr {margin-top: 20px; border-top: 1px dotted #000;}

e poi le linee che vuoi tu le richiami dove meglio credi.

**sevenumber** · 13-03-2006, 17:13

tutto chiaro ma come le richiamo???

**Federix** · 14-03-2006, 11:28

Semplice, basta che metti il tag <hr /> all'interno del codice della pagina.

**sevenumber** · 14-03-2006, 13:18

ok ma il problema sta nel fatto che se voglio una certa usabilità sn costretto ad assegnare

hr { display:none };

in questa maniera però nn posso utilizzare questo elemento quando lo desidero ...

**Federix** · 14-03-2006, 16:12

E per quale motivo devi sopprimere HR??? Non è mica deprecato.

**sevenumber** · 14-03-2006, 16:26

nn è che lo voglio sopprimere, ma se imposto dall'inizio del codice di non visualizzarlo (per farlo invece in altri browser testuali) come faccio?

**Mich_** · 14-03-2006, 16:48

Originariamente inviato da Federix
E per quale motivo devi sopprimere HR??? Non è mica deprecato.

Non e` ancora deprecato, ma pare che lo sara` dalla prossima versione di XHTML.
In effetti e` un elemento di formattazione, per cui dovrebbe stare nei CSS, non nell'(X)HTML.

Consigliano di usare invece un div con altezza molto bassa, con bordo opportuno (per IE occorre anche specificare font-size: 1px; )

**sevenumber** · 14-03-2006, 16:59

ok Mich ma se volessi inserire una riga orizzontale dentro un div come nel mio esempio, nn c'è soluzione?

**Mich_** · 14-03-2006, 17:21

Mipar di ricordare che in futuro ci sara` un
<separator />
di qualche tipo (che non e` esattamente equivalente ad <hr />, dato ceh puo` essere reso in modi diversi ed equivalenti nei diversi mezzi).

Comunque per la riga orizzontale la puoi realizzare con:
<div class="separ"> </div>
dove e` stato definito:

codice:

.separ {
  height: 2px;
  font-size: 1px;
  width: 80%; /* o altro valore */
  border: 0 0 1px 0 solid black;
  margin: 0 auto;
}

Discussione: Linea orizzontale con CSS

Strumenti discussione

Ricerca discussione

Visualizza

Linea orizzontale con CSS

Permessi di invio