• Regolamento Macrocategoria DEV
    Prima di aprire un topic nella Macrocategoria DEV, è bene leggerne il suo regolamento. Sei un'azienda o un hosting/provider? Qui sono anche contenute informazioni per collaborare con Sciax2 ed ottenere l'accredito nella nostra community!

Problema risolto menu' a tendina altro problema riscontrato

annachiara82

Nuovo utente
Autore del topic
12 Novembre 2014
38
0
Miglior risposta
0
salve il menu' a tendina risolto precedentemente tutto ok.
il problema quando vado a cliccare sul menu a tendina (prestazioni) non mantine aperto non mi da la possibilita' di cliccare la voce dove andare e tra un voce e l'altra c'e' molto spazio. vi metto il css creato per il menu' a tendina
grazie Annachiara.

.menu li{
display: block;
float: left;
width: 270px;
height: 50px;
line-height:50px;
text-align: center;
margin-top:70px;
color: #2C3E50;
border-right: 1px solid #2C3E50;
background: -webkit-linear-gradient(top, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
background: -moz-linear-gradient(top, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
background: -o-linear-gradient(top, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
background: -ms-linear-gradient(top, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);

}
.menu li:hover{
cursor: pointer;
background: -webkit-radial-gradient(center, ellipse cover, #ffffff 0%, #e5e5e5 100%);
background: -moz-radial-gradient(center, ellipse cover, #ffffff 0%, #e5e5e5 100%);
background: -o-radial-gradient(center, ellipse cover, #ffffff 0%, #e5e5e5 100%);
background: -ms-radial-gradient(center, ellipse cover, #ffffff 0%, #e5e5e5 100%);
color: slateGrey;
}
.primo{
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
}
.secondo{
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
}
.terzo{
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
}

.sub-menu{
visibility: hidden;
}
.menu li:hover .sub-menu{
visibility: visible;
}
.sub-menu li{
border-top: 1px dotted #2C3E50;
}
.sub-menu li:hover{
width: 145px;
background: -webkit-radial-gradient(center, ellipse cover, #f7fbfc 10%, #add9e4 100%);
background: -moz-radial-gradient(center, ellipse cover, #f7fbfc 10%, #add9e4 100%);
background: -o-radial-gradient(center, ellipse cover, #f7fbfc 10%, #add9e4 100%);
background: -ms-radial-gradient(center, ellipse cover, #f7fbfc 10%, #add9e4 100%);
transition: all 0.1s ease 0s;
-webkit-transition: all 0.1s ease 0s;
-moz-transition: all 0.1s ease 0s;
-o-transition: all 0.1s ease 0s;
-ms-transition: all 0.1s ease 0s;
}
.ultimo-sub{
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}

#menu li {display:inline;}
 
Posta il codice della pagina per la tendina.

Inviato dal mio GT-S5570 con Tapatalk 2

form

<form id="form1"name="form1"method="post"action="esito.php">

<fieldset>
<legend>Alimentazione</legend>

carboidrati <input type="radio" name="linguaggio"value="carboidrati"><br>

proteine <input type="radio" name="linguaggio" value="proteine> <br>

dolci <input type="radio" name="linguaggio" value="dolci"> <br>

</fieldset>

</form>

<input type="submit" value="invia I dati">

</body>
 
proteine <input type="radio" name="linguaggio" value="proteine> <br>


Prima di tutto qua c'è un errore, mancano le virgolette nel value.
Seconda cosa, riesci a postare la demo, o uno screen del problema, perché non riesco a capire quel che succede quando cliccki (che scompare ho capito, ma dipende in che modo :emoji_relieved:).

 
Prima di tutto qua c'è un errore, mancano le virgolette nel value.
Seconda cosa, riesci a postare la demo, o uno screen del problema, perché non riesco a capire quel che succede quando cliccki (che scompare ho capito, ma dipende in che modo :emoji_relieved:).

[/COLOR]

Scusate ho sbagliato il codice non e quello

- - - Aggiornato - - -

div <ul class="menu"><li class="primo"><a href="home.htm"/a> HOME </li><li class="secondo"><a heref="chisono.htm"/a> CHI SONO </li><li>PRESTAZIONI<ul class="sub-menu"><li>111</li><li>22222</li><li class="ultimo-sub">444444</li></ul></li><li>CONTATTI <a href="contatti.htm"/a></li></div><div id="section"><p>Testo</p></div></body></html>
quest e il codice
 
Scusate ho sbagliato il codice non e quello

- - - Aggiornato - - -

div HOME CHI SONO PRESTAZIONI11122222444444CONTATTI Testo
quest e il codice

Fai uno screen del problema che forse so come aiutarti.
Comunque ci sono anche errori di scrittura html tipo hai scritto <a heref e non <a href.
Inviato dal mio GT-S5570 con Tapatalk 2
 
Ultima modifica:
Scusate ho sbagliato il codice non e quello

- - - Aggiornato - - -

div <ul class="menu"><li class="primo"><a href="home.htm"/a> HOME </li><li class="secondo"><a href="chisono.htm"/a> CHI SONO </li><li>PRESTAZIONI<ul class="sub-menu"><li>111</li><li>22222</li><li class="ultimo-sub">444444</li></ul></li><li>CONTATTI <a href="contatti.htm"/a></li></div><div id="section"><p>Testo</p></div></body></html>
quest e il codice

ho scritto velocemente .cmq sai il problema quale'?
 
il problema che se lo vedo dal cellulare il menu a tendina rimane aperto invece navigando dal pc come vado con il cursore sul menu a tendina si apre dopo scendo giu' per cliccare dove devo andare e scompare subito non mi fa permettere di cliccare sul campo dove andare

- - - Aggiornato - - -

ho fatto uno schizzo veloce questo e' il problema che fa:
Perfavore, Entra oppure Registrati per vedere i Link!

andate sul menu articoli (menu a tendina) vedi che succede?:emoji_slight_frown:
e tra un campo e l'altro c'e' molto spazio nel menu a tendina dovevano essere attaccati uno sotto l'altro i rettagolini(campi) che formano il menu
 
Ultima modifica:
Per me è l'attributo width:270px che è troppo grande e fa andare a capo automaticamente i bottoni, lasciando tutto quello spazio.