Problema con div - No toma todo el contenido

[locoxchacho]

Buenas, mi problema es el siguiente:

Yo tengo un div cuyo fondo tiene un color rojizo, y dentro del mismo, varios divs.
Mi idea era que el div que contiene a todos, continue hasta que finalize el ultimo div, y con el, el color del fondo.

Pero lamentablemente no pasa asi, se me corta (o por lo menos el color del fondo) antes de que termine el contenido del resto de los divs, por lo que queda de esta manera:

http://www.proyectoshuerto.com.ar/nuevaimagen/index.php

(es la parte de los+nuevos)

el codigo, por las dudas, es el siguiente:

HTML:

Código:

<div id="lomas">
				<div id="titulos"><strong>lo+</strong>reciente!</div>
				<div id="cuadrado" name="proyectos"><div id="titulocuad"><strong>Proyectos</strong></div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris et dolor. Sed at turpis vitae velit euismod aliquet. Aenean id purus.</div>
				<div id="cuadrado" name="enlaces"><div id="titulocuad">Enlaces</div><img src="http://open.thumbshots.org/image.aspx?url=www.leloir.org.ar" border="1" /><br/>Leloir</div>
				<div id="cuadrado" name="articulos"><div id="titulocuad">Articulos</div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris et dolor. Sed at turpis vitae velit euismod aliquet. Aenean id purus.</div>
				<div id="cuadradoult" name="teoricos"><div id="titulocuad">Teoricos</div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris et dolor. Sed at turpis vitae velit euismod aliquet. Aenean id purus.</div>
			</div>

CSS

Código:

div#explicaprin { margin-top:10px; text-align: justify;
	font-family: "Lucida Grande", "Verdana", sans-serif;
	font-size: 13px;
	color: #000;}
div#firma {text-align:right; margin: 10px 0px  }
div#lomas {
	font-family: "Lucida Grande", "Verdana", sans-serif;
	font-size: 12px;
	color: #000;
	background:#FFB39F;
	padding:5px;
	text-align:center;
	margin-top:15px;
	}
div#titulosprin { font-family:"Evolution", "Verdana", sans-serif; text-align:right; font-size: 25px; color: #000; padding:0 0 10px 0;}
div#cuadrado { width:168px; float:left; border-right: solid 2px #FFF; text-align:justify; padding:5px}
div#cuadradoult {width:168px; float:left; text-align:justify; padding:5px}
div#titulocuad {font-family: "Lucida Grande", "Verdana", sans-serif; font-size:big;
	font-size: 14px;
	color: #000; }

ALGUNA IDEA DE por que pudes estar pasando esto??? ojala puedan ayudarme, desde ya muchas gracias!

un saludo!

pablo

[Calizman]

Saludos!!

Posiblemente sea, que no estas especificando como aparecera tu div, intenta ponerle el display: block; o display: table;

Con alguna de esas dos seguro funciona!

Saludos

EDITO: Dejo el post arriba por si sirve, pero yo veo muy bien la pagina! solo que cuando lo postee, no vi la pagina, la vi luego de postear mi solucion!

[locoxchacho]

no logro verlo bien ni con el opera ni con el firefox.... me lo muestra cortado. Explico por si no se me entendio: quiero que el fondo rojo este tambien en la parte que dice: Articulos, Proyectos, etc., es decir, que llegue hasta abajo.

Pero no pasa. Probe con el display, pero tampoco. alguna otra ayuda, solucion que puedan darme? pq si no resulevo esto, me quedo estancado :S

desde ya muchas gracias, un saludo!

pablo

pd: con respecto a tu edit, Calizzz, a que te referis con que "la ves bien"? saludos!

[Mikmoro]

No me carga tu página.

Aun así, añádele overflow: auto; al selector CSS div#lomas

[Calizman]

Increiblemente, la respuesta de Mik soluciono el problema, te lo digo porque con el codigo estava intentando arreglarlo en mi editor pero no encontraba el problema!

Una vez mas el gran maestro nos ha iluminado!!

Gracias Mik!!

Y aun asi dices que tu pagina no es la gran cosa! Eres Grande!!

[locoxchacho]

funciona! muchas gracias!! ahora si puedo continuar con mi pagina....

lamentablemente, no funciona con el javascript que estaba utilizando para redondear los bordes, asique tendre que utilizar otro metodo... cual me recomiendan?

y por ultimo... alguna opinion del diseño de la pagina en si? les gusto o que le agregarian?

un saludo, muchas gracias por su ayuda!

pablo

[Calizman]

Esquinas redondeadas con JS????? ahí vamos de nuevo!

Noo!! utiliza imagenes para redondear tus esquinas! sera mucho mejor,y mas compatible!!

Que le agregaria o le quitaria a tu web? (a mi humilde criterio)

Le agregaria una barra de el lado izquierdo al igual que la que tiene en el lado derecho, pero para algun tipo de log-in o para algunas noticias sobre tu web... o cosas asi! tambien creo que le cambiaria el color del footer negro, y le pondria algo mas combinado!

Humilde criterio mio... cambiaria muchas cosas, pero realmente es por lo meticuloso que soy, en resumen tu pagina esta muy buena! colores agradables a la vista y sobre todo que esta sencilla y directa, lo mio son solo cosillas que uso normalmente en mis webs.

[locoxchacho]

OK, GRACIAS POR LOS CONSEJOS!! los tendre en cuenta cuando continue con la pagina... solo que ahora me surgió otro inconveniente!!

Resulta que se me ocurrio ver la pagina en IE, y resulta que el menu que en Firefox, Opera, Chrome, se ve todo en una misma linea, horizontalmente (el que dice inicio, Proyectos, etc) se ve en doble fila con IE 7, es decir, hace como un salto de linea.

Como puedo solucionar esto para IE? Porque la mayoria de los usuarios de mis paginas usan IE, asique necesito arreglarlo!! EL CODIGO HTML es:

<div id="logo"><img src="nuevo_logo.gif" /></div><div id="escudo"><img src="escudo.gif" /></div>
<div id="menu"><ul id="nav">
<li class="activelink" ><a href="index.php">HOME</a></li>
<li><a href="proyectos.php">PROYECTOS DE INVESTIGACION</a></li>
<li ><a href="#">TEORICOS</a></li>
<li ><a href="#">SABER COTIDIANO</a></li>
<li ><a href="#">ARTICULOS DE INTERES</a></li>
<li ><a href="#">ENLACES CIENTIFICOS</a></li>
<li ><a href="#">DELEGADOS</a></li>
<li ><a href="#">CONTACTO</a></li>
</ul>
</div>

Y el css el siguiente:

div#logo {float:left; width:auto; padding:10px}
div#escudo {text-align:right; width:auto; padding:10px}

div#menu { margin:0; font-family:Verdana, Geneva, sans-serif; text-align:center;font-size: 11px;color: #000; }
ul#nav{ list-style-type:none; text-align: center; margin:auto; float:left}
ul#nav li{float:left;text-align: center; font-weight:bold; padding:8px}
ul#nav a{text-decoration:none; color:#838383; text-align:center}
ul#nav a:hover{ color:#000; }
ul#nav li.activelink a,ul#nav li.activelink a:hover{ text-decoration:none; color: #000}

Alguna ayuda para solucionar esto??

Muchas gracias! Maldito IE!!!

SAludos!!!


Pablo

[Calizman]

Posiblemente sea porque PROYECTOS DE INVESTIGACION es muy largo y lo toma como si fueran dos lineas...

Porque no intentas darle un width mas largo a ese esa linea...?

[locoxchacho]

no... definitivamente no es eso, porque en el resto de los navegadores me lo toma... y por las dudas, trate de modificar el width, pero sigue igual... la cosa es que el menu no arranca a la izquierda de la pantalla, sino que arranca en la mitad, como si hubiese algun div que lo arrastrase hasta la mitad. Pero no encuentro nada que este provocando esto. Alguna opinion?

Solucion¿?? algo??

muchas gracias nuevamente por los consejos anteriores, desde ya!!

saludos otra vez! pablo.

[Dalvenjha]

Podrías poner todo tu html y todo tu css?, porfavor usa los tag de código si?

Saludos.

[locoxchacho]

ya logre solucionarlo... gracias de todas formas!

un saludo!

pablo.

[pao01]

La página es del colegio Jesús en el Huerto de los Olivos?

[locoxchacho]

en realidad, no es la pagina del colegio en si. De eso se está encargando mi hermana, que es diseñadora profesional.

Yo solo soy un simple aficionado a la programacion y al diseño, y entonces, al pedido de una ex profesora mia del colegio (egrese en el 2007), estoy haciendo esta pagina para una de las materias que se dicta en el ultimo año, Proyectos de Investigacion, en el Polimodal de Ciencias naturales. La idea es que todos, alumnos, padres, etc, puedan ver los proyectos que se realizan en el colegio, que estan muy buenos.

Por? Vos fuiste a ese colegio??

[pao01]

No, no he ido, pero es bien cercano a casa. Simple curiosidad.
Te está quedando muy bonita la página

[locoxchacho]

gracias! :)

espero que los alumnos tambien sepan apreciar el esfuerzo que estoy haciendo, je!

mira que sera tanto el aprecio que le tengo a la profesora que todo, inluido el diseño y la programacion PHP, lo estoy haciendo gratis! jaja... quiero mucho a mi colegio!

saludos, y gracias por la ayuda a todos!!

pablo.

[Calizman]

Creo que al final de cuentas no importa tanto si los alumnos lo aprecian o no, pero creeme que la profesora que te pidio la tarea, quedara muy contenta con tu trabajo! y seguro ganas el curso!

[locoxchacho]

jeje... ojala quede encantada!

igual ya soy ex-alumno, asique no es para ganar o no el curso... solo que mantengo buena relacion desde que termine la escuela.. entonces decidi aceptar su pedido!

en cuanto termine todo publico el link aca para que me den sus comentarios, ojala les guste! un saludo! seguramente pronto estaré volviendo con mas preguntas para el diseño! :P

pablo