Problemas con CSS - matib

#1 (**permalink**) 02/03/2011, 20:06

hola que tal me dirijo a uds. con la misma problemática. Cada que rehago mi página (aunque en realidad nunca termino de hacerla porque siempre me tranco
con algo) no puedo lograr que los div's noticiasindex y videosindex queden
sincronizados. Para que vean lo que digo vallan a http://acceso-directo.net23.net

______
| noti |
| index|
|_____|______
| videos |
| index |
|______|

quiero que resultado sea

_______________
| | |
| | |
|______ |_______|

Las cajas son del mismo tamaño 375.5*400. pero sin embargo se presenta el
problema de arriba. Se nota que soy novato?

================================================== =======
CÓDIGO WEB
================================================== =======
@charset "utf-8";
#contenedor {
height: 894px;
width: 780px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #333333;
}
#capaA {
height: 30px;
width: 751px;
margin-top: 15px;
margin-right: 15px;
margin-left: 15px;
background-color: #666666;
float: left;
}
#logo {
background-color: #666666;
height: 150px;
width: 751px;
margin-right: 15px;
margin-left: 15px;
}
#barmenu1 {
background-color: #666666;
width: 751px;
margin-right: 15px;
margin-left: 15px;
height: 35px;
}
#noticiasindex {
background-color: #666666;
height: 400px;
width: 375.5px;
margin-top: 15px;
margin-left: 15px;

}
#videosindex {
background-color: #666666;
height: 400px;
width: 375.5px;
margin-right: 15px;
float: right;

}
#fotosindex {
background-color: #666666;
float: left;
width: 751px;
height: 200px;
margin-right: 15px;
margin-left: 15px;
}
#copyright {
float: left;
width: 751px;
margin-right: 15px;
margin-left: 15px;
height: 35px;
background-color: #666666;
margin-bottom: 15px;
}

jomaruro · #2 (**permalink**) 03/03/2011, 13:40

Hola:

En primer lugar, ¿Crees que un pixel se puede dividir por la mitad?

Cita:

Iniciado por jmb0286

@charset "utf-8";
#noticiasindex {
background-color: #666666;
height: 400px;
width: 375.5px;
margin-top: 15px;
margin-left: 15px;
}

#videosindex {
background-color: #666666;
height: 400px;
width: 375.5px;
margin-right: 15px;
float: right;
}

Modifícalo y déjalo como 375px.

En segundo lugar div es un elemento de bloque con lo cual te va a ocupar el ancho de su contenedor por eso el segundo div se coloca flotado a la derecha y abajo, para evitar eso deberás flotar el primero, noticiasindex, a la izquierda.

Código CSS:

Ver original#noticiasindex {
    background-color: #666666;
    height: 400px;
    width: 375px;
    margin-top: 15px;
    margin-left: 15px;
    float:left;
}

Saludos.

#3 (**permalink**) 03/03/2011, 15:51

Gracias, por la info.

#4 (**permalink**) 03/03/2011, 18:47

Discuplen mi ignorancia.
Quedó espectacular; ahora como hago para que al lado del cuadro se pueda poner un texto Leer más (por ejemplo).

La idea se me ocurre poniendo varios divs pero es con el padding lo muevo y como lo defino en el css. gracias de vuelta.

#5 (**permalink**) 03/03/2011, 18:50

la página se puede ver http://acceso-directo.net23.net