Problema checked

#1 (**permalink**) 30/08/2017, 09:17

Hola a todos, necesito ayuda, resulta que quiero mostrar un menú haciendo click en un "botón" que sería un label:

Código HTML:

Ver original<html>
    <head>
        <title>Show menu</title>
        
        <style>
        #menu{
        display:none;
        }
 
        #button_menu:checked  ~ #menu{
        display:block;
        }
 
        #button_menu{
        display:none;
        }
        </style>
        
    </head>
    <body>
        <div id="menu">Menu</div>
        <label for="button_menu">show menu</label>
        <input type="checkbox" id="button_menu" />
    </body>
</html>

Pero no se porque no funciona, quiero agregar que button_menu está siendo checkeado, lo verifique.

No se que esta pasando, alguna sugerencia?

Rafael · #2 (**permalink**) 31/08/2017, 23:27

No uses el sibilings, usa el adyacente +

Acá está funcionando:

https://jsfiddle.net/wmo8vmhn/

Código HTML:

Ver original<label for="button_menu">show menu</label>
<input type="checkbox" id="button_menu" />
<div id="menu">Menu</div>

Código CSS:

Ver original#menu {
   display:none;}
 
#button_menu:checked + #menu {
   display:block;}
 
#button_menu{
   display:none;}