Buenos dias hoy les traigo una duda que espero solucionar.
Estoy trabajando con listas y lo que quiero hacer es que en cada item aparezca un nombre y al lado una tableta de colores que se despliega cuando toco en el input.
Mi problema es el siguiente, en el item sale el nombre y debajo el input, nose como eliminar este salto de linea. Si alguien puede ayudarme. La idea es que el input quede al lado.
Codigo:
<ul id="menulateral">
<li id="colores">- Colores:</li>
<li id="items" onclick="#">Color 1<input class="color5" type="text" name="color5" value="#FF00FF" /></li>
<li id="items" onclick="#">Color 2<input class="color5" type="text" name="color5" value="#FF00FF" /></li>
<li id="items" onclick="#">Color 3<input class="color5" type="text" name="color5" value="#FF00FF" /></li>
<li id="items" onclick="#">Color 4<input class="color5" type="text" name="color5" value="#FF00FF" /></li>
</ul>
Como me queda:
(http://s11.postimg.org/y6a945ggz/10723063_10152381571402864_523844448_n.jpg)
Desde ya muchas gracias!
Saludos,, Cronos.-
Qué tienes en el CSS?
Saludos!
ponle al css de los inputs "display:inline-block" eso debería bastar.
saludos!
Gracias por responder, pero la solucion que me pasaste Alexander no me funciono, no noto ningun cambio :/
Esta esto es lo que tengo en el css:
nav#segundo{
float: left;
width: 18%;
height: 548px;
background: #F4F4F4;
border-right: 1px solid #7C7C7C;
border-left: 1px solid #7C7C7C;
}
nav#segundo ul#menulateral{
margin: 0px;
padding: 0px;
list-style-type: none;
}
nav#segundo ul#menulateral li{
margin-left: 10px;
padding-top: 5px;
padding-bottom: 2px;
padding-left: 30px;
}
nav#segundo ul#menulateral li#items:hover{
background-color: #5FACCC;
}
nav#segundo ul#menulateral li#personas{
margin-left: 10px;
padding-top: 5px;
padding-bottom: 2px;
padding-left: 10px;
font-weight: bold;
display:inline-block;
}
input.color5{
display:inline-block;
}
Saludos,, Cronos.-