Foros del Web » Creando para Internet » CSS »

DIVs pequeña ayudita

Estas en el tema de DIVs pequeña ayudita en el foro de CSS en Foros del Web. Hola miembros!! Es que soy iniciado en el css, tengo un problema con el div: "cafe-info" Quiero que aparezca abajo de "cafe-title" (bien pegado) 1) ...
  #1 (permalink)  
Antiguo 21/08/2008, 13:38
 
Fecha de Ingreso: septiembre-2006
Mensajes: 132
Antigüedad: 11 años, 3 meses
Puntos: 2
DIVs pequeña ayudita

Hola miembros!! Es que soy iniciado en el css, tengo un problema con el div: "cafe-info"

Quiero que aparezca abajo de "cafe-title" (bien pegado)

1) Que es lo que se tiene que hacer?
2) Una cosa mas, en el div "cafe-info" quisiera que la lista no tenga ese margim top que tiene, como se achica?

mil gracias

Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">

.cafe-grande {
width:525px; 
height:180px;
background: #FBE0A8;
border: #EFD3A3 1px solid;
margin-bottom: 20px}

.cafe-img {
width:225px;
height:140px;
border: #EFD3A3 1px solid;
margin:20px 10px 10px 20px}

.cafe-title {
float:right;
width:250px;
margin:20px 10px 10px 0px;
color:#5D362F;
font-family: Arial, Helvetica, sans-serif,;
font-weight:bold;
font-size: 15px}

.cafe-info {
float:right;
position: static;
width:250px;
margin: 0px 10px 10px 0px;
color:#5D362F}

body {
	background-color: #FCE7BC;
}
</style>
</head>

<body>
<div class="cafe-grande">
  <div class="cafe-title">Crocante de Nuez</div>

    <div class="cafe-img"><img src="http://marinaorione.com.ar/img/promo-cafe-crocante.jpg" alt="Crocante de Nuez" width="225" height="140" /></div>
	<div class="cafe-info">
	  <ul>
	    <li>Masa dulce</li>
        <li>Crocabte de miel y az&uacute;car nega</li>
	    <li>Nueces</li>
	  </ul>
    </div>
    </div>
</body>
</html> 
  #2 (permalink)  
Antiguo 22/08/2008, 02:03
 
Fecha de Ingreso: agosto-2008
Mensajes: 218
Antigüedad: 9 años, 4 meses
Puntos: 6
Respuesta: DIVs pequeña ayudita

pon a cafe-title el margin:20px 10px 0px 0px

ya que cuando defines los margin a partir de margin recuerda que es:

margin: arriba derecha abajo izquierda.
  #3 (permalink)  
Antiguo 22/08/2008, 02:05
 
Fecha de Ingreso: agosto-2008
Mensajes: 218
Antigüedad: 9 años, 4 meses
Puntos: 6
Respuesta: DIVs pequeña ayudita

lo de la lista prueba con

padding-top:0px y/o cafe-info UL{margin-top:0px}
  #4 (permalink)  
Antiguo 22/08/2008, 06:22
 
Fecha de Ingreso: septiembre-2006
Mensajes: 132
Antigüedad: 11 años, 3 meses
Puntos: 2
Respuesta: DIVs pequeña ayudita

Gracias por todo, lo de la lista lo solucione con esto:

ul {
margin-left: 0;
padding-left: 1em;
margin-top: 0;
padding-top: -1em;
text-indent: -1em;
list-style-position: inside}
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 03:19.