Foros del Web » Creando para Internet » CSS »

Problema con CLEAR y FLOAT

Estas en el tema de Problema con CLEAR y FLOAT en el foro de CSS en Foros del Web. Estoy haciendo un modelo d pagina todo en CSS con capas: http://www.torneosnydus.com/template.htm Vean el centro, quiero poner 2 capas, en una dice el titulo de ...
  #1 (permalink)  
Antiguo 08/07/2005, 11:29
Avatar de SiR.CARAJ0DIDA  
Fecha de Ingreso: junio-2004
Ubicación: Acá
Mensajes: 1.166
Antigüedad: 13 años, 5 meses
Puntos: 4
Pregunta Problema con CLEAR y FLOAT

Estoy haciendo un modelo d pagina todo en CSS con capas:
http://www.torneosnydus.com/template.htm

Vean el centro, quiero poner 2 capas, en una dice el titulo de la noticia y en otra quien la envió y la fecha y abajo la capa q contiene la noticia. Como ven use el float:left y float:right y la capa de abajo use clear:both pero se pone abajo de los paneles izquiero y derecho como se supone que puedo hacer eso?

Tambien probe sin float y con display:inline pero las 2 capas aparecen en cualquier lado.





Bueno, ya lo solucioné jeje soy muy impaciente cuando no me sale algo.
Muy lindo se ve en firefox y opera, pero en explorer se ve deprimente, asi que eso de diseñar solo con capas no es muy bueno q digamos hasta q salga explorer 7.

Última edición por SiR.CARAJ0DIDA; 08/07/2005 a las 12:31
  #2 (permalink)  
Antiguo 08/07/2005, 12:33
Avatar de Durgeoble  
Fecha de Ingreso: marzo-2003
Mensajes: 462
Antigüedad: 14 años, 8 meses
Puntos: 2
Porque ese empeño en usar las capas como si fueran tablas, jamas lo entendere.
Lo que quieres no requiere de varias capas, por el contrario un uso adecuado de css te ahorrara mucho codigo inutil.
que quieres una capa que tenga titulo, creador y a continuacion la noticia
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
	
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<title></title>
	<style type="text/css">
	.noticia {
	background-color: #F0E68C;
}
.noticia>h1 {
	color: maroon;
	padding-bottom: 0;
	margin-bottom: 0;
}
.noticia>h2 {
	padding-top: 0;
	margin-top: 0;
	font-size: 10px;
}
.noticia p:first-letter {
	text-transform: capitalize;
}
	</style>
</head>

<body>
<div class="noticia">
<h1>Aqui el titulo de la noticia</h1>
<h2>enviado por <a href="#">Durgeoble</a> hoy a saber a que hora</h2>
<p>aqui puedes poner una noticia, puede ser o no interesante, todo depende de la capacidad creativa del redactor de la noticia</p></div>
</body>
</html> 
__________________
Todas mis respuestas funcionaran correctamente en aquellos navegadores que respeten los estandares.
  #3 (permalink)  
Antiguo 08/07/2005, 14:34
Avatar de SiR.CARAJ0DIDA  
Fecha de Ingreso: junio-2004
Ubicación: Acá
Mensajes: 1.166
Antigüedad: 13 años, 5 meses
Puntos: 4
bueno.. ese diseño no es justamente como me gusta a mi.

Cita:
Porque ese empeño en usar las capas como si fueran tablas, jamas lo entendere.
como, no es que todos odian las tablas y que se ven mal, etc?
  #4 (permalink)  
Antiguo 08/07/2005, 15:06
Avatar de CORE
Usuario no validado
 
Fecha de Ingreso: abril-2002
Ubicación: Merida
Mensajes: 2.165
Antigüedad: 15 años, 8 meses
Puntos: 3
Hola si entendi bien

necesitas que div#foot aparesca hasta bajo y que no se pase debajo de tus menus lo que tienes qie hacer es meter foot dentro de div#centro

saludos
  #5 (permalink)  
Antiguo 08/07/2005, 15:27
Avatar de RoQ
RoQ
 
Fecha de Ingreso: abril-2005
Mensajes: 771
Antigüedad: 12 años, 7 meses
Puntos: 0
creo que Durgeoble se refiere a partes como esta:
Código:
<body onload="">
	<div id="main">
		<div id="top">Este es el top, aca va una imagen</div>
		<div id="izq">
			<div class="modulo">
				<div class="B">Titulo del modulo</div>
				<div class="A">Foro</div>

				<div class="A">Noticias</div>
				<div class="A">Encuestas</div>
				<div class="A">Entrevistas</div>
			</div>
			<div class="modulo">
				<div class="B">Titulo del modulo</div>
				<div class="A">Foro</div>

				<div class="A">Noticias</div>
				<div class="A">Encuestas</div>
				<div class="A">Entrevistas</div>
			</div>
			<div class="modulo">
				<div class="B">Titulo del modulo</div>
				<div class="A">Foro</div>

				<div class="A">Noticias</div>
				<div class="A">Encuestas</div>
				<div class="A">Entrevistas</div>
			</div>
			<div class="modulo">
				<div class="B">Titulo del modulo</div>
				<div class="A">Foro</div>

				<div class="A">Noticias</div>
				<div class="A">Encuestas</div>
				<div class="A">Entrevistas</div>
			</div>
		</div>
puedes usar listas y no tantas capas a modo de tablas o algo por el estilo
  #6 (permalink)  
Antiguo 08/07/2005, 15:45
Avatar de Durgeoble  
Fecha de Ingreso: marzo-2003
Mensajes: 462
Antigüedad: 14 años, 8 meses
Puntos: 2
en realidad no mire siquiera el codigo, solo di respuesta a la pregunta especifica que hizo
Cita:
Iniciado por SiR.CARAJ0DIDA
Vean el centro, quiero poner 2 capas, en una(1) dice el titulo de la noticia y en otra(2) quien la envió y la fecha y abajo(3) la capa q contiene la noticia.
A eso corresponde el codigo que puse, el hecho de que quiera una capa para el titulo, otra para la fecha y autor y otra mas para la noticia (3 en total) refleja una reminiscencia del uso de tablas "cada cosa en su celda" cuando en css cada etiqueta puede ser "una celda" si asi se especifica, solo hay que usarlo correctamente.

Estoy haciendo un articulo sobre como substiruir tablas por capas de forma "correcta" es decir sin caer en el exceso y aplicando css como fue diseñado, para variar IE presenta una total incompatibilidad con la mayoria de las cosas por lo que hay que buscarle la vuelta de tuerca para que funcione :(
__________________
Todas mis respuestas funcionaran correctamente en aquellos navegadores que respeten los estandares.
  #7 (permalink)  
Antiguo 08/07/2005, 16:54
Avatar de SiR.CARAJ0DIDA  
Fecha de Ingreso: junio-2004
Ubicación: Acá
Mensajes: 1.166
Antigüedad: 13 años, 5 meses
Puntos: 4
Bueno es simple, el que use ie que se joda :D
Si tengo q hacer una pagina para cada navegador me vuelvo loco, ademas se supone q explorer 7 sera totalmente compatible con CSS 2
  #8 (permalink)  
Antiguo 08/07/2005, 16:55
Avatar de RoQ
RoQ
 
Fecha de Ingreso: abril-2005
Mensajes: 771
Antigüedad: 12 años, 7 meses
Puntos: 0
Cita:
Iniciado por SiR.CARAJ0DIDA
Bueno es simple, el que use ie que se joda :D
Si tengo q hacer una pagina para cada navegador me vuelvo loco, ademas se supone q explorer 7 sera totalmente compatible con CSS 2
jaja el 90% estara jodido entonces
  #9 (permalink)  
Antiguo 09/07/2005, 02:20
Avatar de Durgeoble  
Fecha de Ingreso: marzo-2003
Mensajes: 462
Antigüedad: 14 años, 8 meses
Puntos: 2
Cita:
Iniciado por SiR.CARAJ0DIDA
explorer 7 sera totalmente compatible con CSS 2
Eso lo tendran que ver mis ojos para creermelo XD
__________________
Todas mis respuestas funcionaran correctamente en aquellos navegadores que respeten los estandares.
  #10 (permalink)  
Antiguo 09/07/2005, 11:29
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 12 años, 6 meses
Puntos: 17
Será compatible con CSS 2, cuando todos los demás serán compatibles con CSS3!
__________________
Al final del día hablar es gratis, codificar no lo es
  #11 (permalink)  
Antiguo 09/07/2005, 11:38
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 3 meses
Puntos: 380
Cita:
Iniciado por RoQ
jaja el 90% estara jodido entonces


Cita:
Iniciado por baccxus
Será compatible con CSS 2, cuando todos los demás serán compatibles con CSS3!
lo más probable para no perder el ritmo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:54.