Foros del Web » Diseño de Sitios web » CSS »

No me funciona la propiedad clear:both

 Estas en el tema de No me funciona la propiedad clear:both en el foro de CSS en Foros del Web. Bueno chicos antes de crear este tema busque por la web todo lo relacionado con el clear:both ya que quiero estirar una capa en la ...
  #1 (permalink)  
Antiguo 01/08/2010, 00:02
 
Fecha de Ingreso: marzo-2010
Mensajes: 10
Pregunta No me funciona la propiedad clear:both
Bueno chicos antes de crear este tema busque por la web todo lo relacionado con el clear:both ya que quiero estirar una capa en la barra lateral para que no se vea vacía, pero agrego esta funcion en el html <div class="clearAll"></div> y no funciona

esta es la css del clearAll

.clearAll{
clear:both;
}

aqui les muestro mi css para que miren a lo que me refiero

Código: 
* {
	margin:0;
	padding:0;
	border:0;
}

a {
	color: #1e449d;
	text-decoration: underline
}	


 a:hover {
	color: #1e449d;
	text-decoration: none}

body {
	font:11px Verdana, Arial, Tahoma, sans-serif;
	background:#fff url("imagenes/fondo.gif") repeat;
	margin-top:0px;
	
	
}

#contenedor {
    width:900px;
	background:#fff;
	margin:0 auto 0 auto;
	border-right:2px solid #277ec7;
}

#menu_principal {
	background:#ecebeb;
	font-weight:bold;
	font-family:Arial, Tahoma, Verdana, sans-serif;
	margin-right:2px;
	margin-left:2px;
	height:24px;
	margin-bottom:1px;
	
}
	
#menu_principal a span {
    background:#ffffff;
	line-height:21px;
	padding:0 8px;
	display:block;
	
}
	
#menu_principal a.pestana {
	
	border-top:1px solid #dcdcdc;
	border-left:1px solid #dcdcdc;
	border-right:1px solid #dcdcdc;
	text-decoration:none;
	background-color:transparent;
	color:#2d71ed;
	float:right;
	margin:3px 3px 0 0;
	outline:none;
}

#menu_principal a:hover {
	background:#fff;
	border-top:1px solid #2c71e2;
	border-left:1px solid #2c71e2;
	border-right:1px solid #2c71e2;
	color:#000000;
}

 /*definimos el logo de la pagina*/
#banner{
	background:#fff url("/v4/imagenes/logo.jpg") left;
	height:95px;
	text-align:right;
	margin-right:2px;
	margin-left:2px;
}
#sddbar {
padding: 3px;
border: 1px solid #ccc;
margin-left: 610px;
width: 275px;
text-align: justify;
position: absolute;
background-color: #F1F1F1;
opacity:0.8;filter:alpha(opacity=60);

}

#sddbar:hover {
opacity:1;filter:alpha(opacity=100);
}


#footer {
	background:#9b9b9b url("/imagenes/footer_izq.gif") left top no-repeat;
	margin:10px 2px 0px 2px;
	color:#000;
}

	#footer div {
		background:transparent url("/imagenes/footer_der.gif") right top no-repeat;
		padding:0 8px;
		line-height:24px;
		
	}
	
	#footer a {
	color:#000;
	text-decoration:none;
	
	}
	
	#footer a:hover {
	color:#000;
	text-decoration:none;
	}
#footer img
{
margin-left:10px;
margin-top:3px;
}	

.menu_simple
{
	font-size:10px;
	padding:0 13px;
	line-height:20px;
	border-bottom:1px dashed #a5a5a5;
	margin-bottom:10px;
	min-height:20px;
}

#publicidad {
	text-align:center;
	margin-top:10px;
	margin-bottom:10px;
}

	div#mensaje {
			background-color:#f3d7d7;
			border:1px solid #000;
			border-bottom:1px solid #000;
			padding:10px;
			margin-right:10px;
			margin-left:10px;
			margin-bottom:10px;
			
		}
		
		div#mensaje {
			
			color:#000;
			line-height:16px;
		}
		
			div#mensaje a {
				color:#000;
			}
#cuerpo_de_noticias{
    padding-bottom:5px;
	margin-bottom:10px;
	border-bottom:1px solid #dcdcdc;	
}

#cuerpo_de_noticias a:hover{
    text-decoration:none;	
}
#noticias{
	width:570px;
	text-align: left;
	padding-left: 8px;
}			

h1 small {
	display: block;
	font-size: 55%;
}

h1 {
	font-size:14px;
	color:#3386cc;
}

h1 a {
	color:#CC6633 !important;
	text-decoration:none !important;
}
	
h1 a:hover {
	text-decoration:underline !important;
}

#separador {
color:#000000 !important;
border: 1px solid #FFA851;
}

#pestana_noticias {
	border-bottom:1px solid #2d71ed;
	font-weight:bold;
	font-family:Arial, Tahoma, Verdana, sans-serif;
	height:25px;
	margin-bottom:10px;
	padding-left:0px;
	
}

#pestana_noticias a span {
    
	line-height:21px;
	padding:0 8px;
	display:block;
	
}
	
#pestana_noticias a.pestana {
	border-bottom:1px solid #2d71ed;
	border-top:1px solid #dcdcdc;
	border-left:1px solid #dcdcdc;
	border-right:1px solid #dcdcdc;
	text-decoration:none;
	background-color:transparent;
	color:#2d71ed;
	float:left;
	margin:3px 3px 0 0;
	outline:none;
}
#pestana_noticias a.selec {
	border-bottom:1px solid #fff;
	border-top:1px solid #2c71e2;
	border-left:1px solid #2c71e2;
	border-right:1px solid #2c71e2;
	text-decoration:none;
	background-color:#fff;
	color:#2d71ed;
	float:left;
	margin:3px 3px 0 0;
	outline:none;
}


#pestana_noticias a:hover {
	background:#fff;
	border-bottom:1px solid #fff;
	border-top:1px solid #2c71e2;
	border-left:1px solid #2c71e2;
	border-right:1px solid #2c71e2;
	color:#000000;
}
/*Definimos los divs de los bloques*/

#bloque{
width:300px;
margin-bottom:-10px;
float:right;

}
#cuerpo_bloque{
	background:#f2f1f1; 
}
dl.ultimos_foro {
	padding:10px;
	background:#f2f1f1;
}

dl.ultimos_foro a:visited {
    font-family: Verdana, Arial, Tahoma, sans-serif;
	font-weight:none;
	font-size:11px;
	color:#4B4B4B;
	text-decoration:none;
}
			
dl.ultimos_foro a {
    font-family: Verdana, Arial, Tahoma, sans-serif;
	font-weight:none;
	font-size:11px;
	color:#4B4B4B;
	text-decoration:none;
}
				
dl.ultimos_foro a:hover {
	color:#2d71ed;
	text-decoration:underline;
}
			
.ultimos_foro dd {
    font-family: Verdana, Arial, Tahoma, sans-serif;
	font-weight:none;
	color:#b3b3b3;
	font-size:9px;
	padding-left:11px;
	margin-bottom:5px;
}
			


#ultimos_foros {
	background:#ffffff;
	font-weight:bold;
	font-family:Arial, Tahoma, Verdana, sans-serif;
	height:24px;
	margin-bottom:1px;
}
	
#ultimos_foros div span {
	
	line-height:21px;
	padding:0 8px;
	display:block;
	
}
	
#ultimos_foros div.pestana {
	border-top:1px solid #dcdcdc;
	border-left:1px solid #dcdcdc;
	border-right:1px solid #dcdcdc;
	text-decoration:none;
	background-color:#ffffff;
	color:#2d71ed;
	float:left;
	margin:3px 3px 0 0;
	outline:none;
}

#ultimos_foros div:hover {
	background:#fff;
	border-top:1px solid #2d71ed;
	border-left:1px solid #2d71ed;
	border-right:1px solid #2d71ed;
	color:#000000;
	cursor: pointer;
}
.button {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
background:#fff;
border:#333;
}

/* Rollover buttons
   Based on: http://wellstyled.com/css-nopreload-rollovers.html
----------------------------------------*/
.buttons {
	float: right;
	width: auto;
	height: auto;
}

/* Rollover state */
.buttons div {
	float: left;
	margin: 0 5px 0 0;
	background-position: 0 100%;
}

/* Rolloff state */
.buttons div a {
	display: block;
	width: 100%;
	height: 100%;
	background-position: 0 0;
	position: relative;
	overflow: hidden;
}

input.button1, input.button2 {
	font-size: 1em;
}

a.button1, input.button1, input.button3, a.button2, input.button2 {
	width: auto !important;
	padding-top: 1px;
	padding-bottom: 1px;
	font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
	color: #000;
	background: #FAFAFA none repeat-x top left;
}

a.button1, input.button1 {
	font-weight: bold;
	border: 1px solid #666666;
}

input.button3 {
	padding: 0;
	margin: 0;
	line-height: 5px;
	height: 12px;
	background-image: none;
	font-variant: small-caps;
}
/* Form button styles
---------------------------------------- */

a.button1, input.button1, input.button3, a.button2, input.button2 {
	color: #000;
	background-color: #FAFAFA;
	background-image: url("/images/bg_button.gif");
	cursor:pointer;
}

a.button1, input.button1 {
	border-color: #666666;
}

input.button3 {
	background-image: none;
}
/* Alternative button */
a.button2, input.button2, input.button3 {
	border: 1px solid #666666;
}

/* <a> button in the style of the form buttons */
a.button1, a.button1:link, a.button1:visited, a.button1:active, a.button2, a.button2:link, a.button2:visited, a.button2:active {
	text-decoration: none;
	color: #000000;
	padding: 2px 8px;
	line-height: 250%;
	vertical-align: text-bottom;
	background-position: 0 1px;
}

/* Hover states */
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
	border: 1px solid #3366FF;
	background-position: 0 100%;
	color: #3366FF;
}

input.disabled {
	font-weight: normal;
	color: #666666;
}
Si me pudieran ayudar les estaria agradecido :D
  #2 (permalink)  
Antiguo 01/08/2010, 23:04
 
Fecha de Ingreso: marzo-2010
Mensajes: 10
Respuesta: No me funciona la propiedad clear:both
Alguna idea jovenes? por mas que intento no logro hacer funcionar esta propiedad :S
  #3 (permalink)  
Antiguo 02/08/2010, 13:57
Avatar de jomaruro
Colaborador
  
Fecha de Ingreso: noviembre-2002
Ubicación: Coruscant
Mensajes: 5.155
Respuesta: No me funciona la propiedad clear:both
Hola:

Sería mejor que pusieras la URL de tu web o por lo menos tambien el HTML. Viendo solo el CSS es difícil saber que es cada cosa y donde está puesta.

Saludos.
  #4 (permalink)  
Antiguo 02/08/2010, 15:34
 
Fecha de Ingreso: marzo-2010
Mensajes: 10
Respuesta: No me funciona la propiedad clear:both
Gracias por responder bro aquí dejo el enlace a la web

http://www.necross-fansub.com/v4
  #5 (permalink)  
Antiguo 02/08/2010, 16:14
Avatar de elbuensaint  
Fecha de Ingreso: marzo-2009
Ubicación: Chiwas
Mensajes: 173
Respuesta: No me funciona la propiedad clear:both
pero en ese enlace no usas ningun div con class "clearAll", solo vi al principio un div con la clase "clear". Para que quieres usar el div clearAll o que es lo que esperas ver en tu diseño?

Porque por como lo veo, si el div que quieres que tenga la clase clearAll esta al inicio del body, sin contenido ni ancho-alto definido y con clear:both, no pasara nada, se mostrará el contenido como si no hubiera nada ahí, porque realmente no hay nada dentro del div.
  #6 (permalink)  
Antiguo 02/08/2010, 17:14
 
Fecha de Ingreso: marzo-2010
Mensajes: 10
Respuesta: No me funciona la propiedad clear:both
Lo que quiero lograr es como esta web

http://www.mcanime.net

osea como ellos tienen su barra lateral.
Última edición por NeoAkira; 03/08/2010 a las 22:19
  #7 (permalink)  
Antiguo 03/08/2010, 16:30
Avatar de jomaruro
Colaborador
  
Fecha de Ingreso: noviembre-2002
Ubicación: Coruscant
Mensajes: 5.155
Respuesta: No me funciona la propiedad clear:both
Hola:

No entiendo que quieres hacer ni donde, no sé a que barra lateral te refieres ni donde la quieres poner.

Saludos.
  #8 (permalink)  
Antiguo 03/08/2010, 17:18
Avatar de DragonX
Colaborador
  
Fecha de Ingreso: noviembre-2002
Ubicación: Funkyland
Mensajes: 8.332
Respuesta: No me funciona la propiedad clear:both
Cita:
Iniciado por NeoAkira Ver Mensaje
http://www.mcanine.net


http://www.mcanime.net/
Y que es l oque queres hacer?
  #9 (permalink)  
Antiguo 03/08/2010, 22:19
 
Fecha de Ingreso: marzo-2010
Mensajes: 10
Respuesta: No me funciona la propiedad clear:both
Bueno lo que quiero es que la barra lateral que esta en mi web vease la url que deje arriba, se deslize por completo hacía abajo y que no quede ese espacio vacío, por el momento no tengo aplicada la función clear:both
  #10 (permalink)  
Antiguo 13/09/2010, 03:20
 
Fecha de Ingreso: marzo-2010
Mensajes: 10
Respuesta: No me funciona la propiedad clear:both
borrado por admin

Etiquetas: propiedad
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

¿Nuevo en el foro? Regístrate

« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 00:02.
SEO by vBSEO 3.3.2