elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Curso de javascript por TickTack


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Problema con div y float
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Problema con div y float  (Leído 2,741 veces)
hegispok

Desconectado Desconectado

Mensajes: 7


Ver Perfil
Problema con div y float
« en: 2 Febrero 2016, 18:43 pm »

Buenas, soy nuevo por aquí y por el diseño de webs, tengo un pequeño problema y no encuentro la manera de solucionarlo, lo mas probable es que sea una tontería de nada  :-\

Pongo el código y ahora me explico:
Código:
<html>

 <style>
 img{
 widht:100px;
 height:100px;
 }
 div#fondo{
  margin:auto;
  margin-top:5px;
  width:465px;
  height:auto;
  background-color:yellow;
 }
 div#abc{
  margin-left:10px;
  float:null;
 }
 </style>

 <div id="fondo">
  <div id="abc">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
  </div>
 </div>

</html>

La cosa es que todo sale bien, las imágenes pequeñitas, en fila y columnas y el fondo amarillo, pero el problema viene cuando quiero cambiar el valor de "float:null;" a "float:left;", al hacer esto, el fondo amarillo desaparece por completo, y necesito que esté en left y se vea el fondo amarillo, para otro código diferente a este.

PD: Poniendo el "height" del "div#fondo" en cualquier numero se ve, pero necesito que sea "auto", ya que a veces habrá mas imágenes y otras veces habrá menos.

Espero que me podáis ayudar.
Saludos.  ;D


« Última modificación: 2 Febrero 2016, 19:14 pm por hegispok » En línea

WHK
Moderador Global
***
Desconectado Desconectado

Mensajes: 6.605


Sin conocimiento no hay espíritu


Ver Perfil WWW
Re: Problema con div y float
« Respuesta #1 en: 2 Febrero 2016, 19:25 pm »

De verdad no entiendo que cosa quieres hacer especificamente con tu diseño, pero supongo que lo que necesitas es un <div style="clear:both"></div> para que la division flotante quede dentro del objeto padre con sus mismas medidas de altura.


En línea

IBE

Desconectado Desconectado

Mensajes: 9



Ver Perfil
Re: Problema con div y float
« Respuesta #2 en: 3 Febrero 2016, 00:07 am »

Buenas, soy nuevo por aquí y por el diseño de webs, tengo un pequeño problema y no encuentro la manera de solucionarlo, lo mas probable es que sea una tontería de nada  :-\

Pongo el código y ahora me explico:
Código:
<html>

 <style>
 img{
 widht:100px;
 height:100px;
 }
 div#fondo{
  margin:auto;
  margin-top:5px;
  width:465px;
  height:auto;
  background-color:yellow;
 }
 div#abc{
  margin-left:10px;
  float:null;
 }
 </style>

 <div id="fondo">
  <div id="abc">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
  </div>
 </div>

</html>

La cosa es que todo sale bien, las imágenes pequeñitas, en fila y columnas y el fondo amarillo, pero el problema viene cuando quiero cambiar el valor de "float:null;" a "float:left;", al hacer esto, el fondo amarillo desaparece por completo, y necesito que esté en left y se vea el fondo amarillo, para otro código diferente a este.

PD: Poniendo el "height" del "div#fondo" en cualquier numero se ve, pero necesito que sea "auto", ya que a veces habrá mas imágenes y otras veces habrá menos.

Espero que me podáis ayudar.
Saludos.  ;D
No se si he entendido bien lo que querías plantear pero... es esto?
Código:
<html>

 <style>
 img{
 widht:100px;
 height:100px;
 }
 div#fondo{
  margin:auto;
  margin-top:5px;
  width:465px;
  height:auto;
  background-color:yellow;
 }
 div#abc{
  margin-left:10px;
  float:auto;
 }
 </style>

 <div id="fondo">
  <div id="abc" style="clear:both">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
   <img src="http://www.enbolivia.com/files/imagen_corporativa.jpg">
  </div>
 </div>

</html>
En línea

hegispok

Desconectado Desconectado

Mensajes: 7


Ver Perfil
Re: Problema con div y float
« Respuesta #3 en: 3 Febrero 2016, 00:41 am »

Puse <div style="clear: both;"></div> al final del código y funcionó.
¡Gracias a ambos!
Saludos.  ;-)
« Última modificación: 3 Febrero 2016, 00:44 am por hegispok » En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
[MYSQL] Problema con float
PHP
Alex_bro 3 16,850 Último mensaje 29 Marzo 2009, 19:54 pm
por ^Tifa^
problema con la variable float « 1 2 »
Programación C/C++
SMFSM 10 5,106 Último mensaje 2 Marzo 2014, 22:48 pm
por leosansan
Problema con float y double!!!!
Programación C/C++
EdgarKrieger 6 3,988 Último mensaje 23 Mayo 2014, 01:57 am
por Blaster
Problema con undefined reference to `Shoot::Shoot(float,float)´
Programación General
nakas95 2 2,299 Último mensaje 20 Mayo 2014, 00:17 am
por nakas95
problema con asignar un float
Programación C/C++
d91 2 1,941 Último mensaje 24 Octubre 2015, 08:23 am
por do-while
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines