The Best Geek Forum

menu orizzontale

Hai bisogno di aiuto per il tuo codice?? Posta qui il tuo problema! Degli utenti specializzati provvederanno subito ad assisterti!

Moderatore: Moderatore in prova

In pratica ho creato questo menu, vorrei però che il tasto che torna ad home non sia attaccato ma sia totalmente spostato a destra lasciando lo spazio nero nel mezzo.
Come posso fare??

questo è il codice html

Codice: Seleziona tutto

<HTML>
  <HEAD>
  <TITLE>buffon</TITLE>
  <link rel=stylesheet href="menu.css" type="text/css">
  </HEAD>
  <BODY background="SFONDO.jpg">
      <H1> <font color=FFFFF> BUFFON </font> </H1>
<div id="hormenu"> 
 <ul> 
 <li><a href="trofei buffon.html">TROFEI VINTI</a> 
 </ul>
 </li> 
<ul> 
 <li><a href="video buffon.html">VIDEO DI BUFFON</a> 
 </ul>
 </li> 
 <ul> 
 <li><a href="home page.html">TORNA AD HOME</a> 
 </ul>
 </li> 
 </div>
 </table>
</body>
</HTML>


QUESTO IL CSS


div#hormenu {
 width: 100%; 
float: left; 
margin: 0; 
padding: 0;
 border-top: 1px solid black;
 background: black;
 }
 
 div#hormenu ul {
 margin: 0;
 padding: 0;
 list-style-type: none;
 }
 
 div#hormenu li {
 width:100px;
 float:left;
 margin: 0;
 padding: 0;
 border-right: 1px solid black;
 color:background="SFONDO.jpg" ;
 }
 
 div#hormenu a {
 display: block;
 padding: 5px;
 color: #FFFFFF;
 text-decoration: none;
 }
 
 
 div#hormenu a:hover {
 background-color: #000033;
 color: #0047AB;
 text-decoration: none;
 }
 
 div#hormenu li ul {display: none}
 
 div#hormenu li:hover ul {
 display: block;
 position: absolute;
 z-index:1;
 width:150px;
 padding: 0;
 margin: 0 0 0 -1px;
 border:1px solid black;
 background: black;
 }
 
 div#hormenu li li {border: none; width: 150px;} 
div#hormenu li li a {padding: 2px 2px 2px 10px;}
Salve,
In quanto utente già pratico del Forum, ti ricordo di rispettare la corretta forma di richiesta programmazione, di non URLARE poiché contro il Regolamento del Forum e di inserire il TAG in MAIUSCOLO e non in minuscolo.

In merito al problema, aspettiamo Mario o qualche altro utente che saprà consigliarti meglio di me :)
Ciao allora semplicissimo. Elimina dal div che hai creato il tasto home e crea un secondo div in modo da spostarlo liberamente.
Per il css ti consiglio questo codice

Codice: Seleziona tutto

#home{position:absolute;
top:6%;
left:6%;
}
Chiaramente home sara il nome del div. Per la barra nero al centro applica un margine destro o sinistro ad un div e coloralo di ner. Di seguito codici utili.

Codice: Seleziona tutto


#home{position:absolute;
top:6%;
left:6%;
border-top-color: WHITE;
border-top-style: solid;
border-top-width: 2%;
border-bottom-color: WHITE;
border-bottom-style: solid;
border-bottom-width: 2%;
}
Lo stesso concetto vale per i bordi destri e sinistri sostituendo a botton, left o right. Fammi sapere se hai problemi.
Giuseppe La Gualano ha scritto:Salve,
In quanto utente già pratico del Forum, ti ricordo di rispettare la corretta forma di richiesta programmazione, di non URLARE poiché contro il Regolamento del Forum e di inserire il TAG in MAIUSCOLO e non in minuscolo.

In merito al problema, aspettiamo Mario o qualche altro utente che saprà consigliarti meglio di me :)



che significa urlare?? non stavo mica urlando!
Mario ha scritto:Ciao allora semplicissimo. Elimina dal div che hai creato il tasto home e crea un secondo div in modo da spostarlo liberamente.
Per il css ti consiglio questo codice

Codice: Seleziona tutto

#home{position:absolute;
top:6%;
left:6%;
}
Chiaramente home sara il nome del div. Per la barra nero al centro applica un margine destro o sinistro ad un div e coloralo di ner. Di seguito codici utili.

Codice: Seleziona tutto


#home{position:absolute;
top:6%;
left:6%;
border-top-color: WHITE;
border-top-style: solid;
border-top-width: 2%;
border-bottom-color: WHITE;
border-bottom-style: solid;
border-bottom-width: 2%;
}
Lo stesso concetto vale per i bordi destri e sinistri sostituendo a botton, left o right. Fammi sapere se hai problemi.

ciao guarda mica potresti farmelo te il codice html come hai detto cosi non sbaglio??
Pagina HTML

Codice: Seleziona tutto

<html>
<head>
<link href="NOME-CSS-DI-QUESTA-PAGINA.css" rel="stylesheet" type="text/css"> //inserisci il nome della tua pagina CSS
</head>
<body>
<div id="home"><a href="home.html">Home</a></div> //questo sarà il tasto home 
</body>
</html>
Pagina CSS

Codice: Seleziona tutto

#home{position:absolute;  //i valori top e left mettili in base a dove vuoi che si trovino nella pagina
top:6%;  
left:6%;
border-right-color: BLACK; //cambia il colore del bordo se ti serve
border-right-style: solid; // cambia la consistenza del bordo (spessore)
}
grazie ma non mi funziona
Fai copia e incolla delle tue due pagine e ti cerco l'errore.