Foros del Web » Creando para Internet » CSS »

divs para el background

Estas en el tema de divs para el background en el foro de CSS en Foros del Web. hola a todos, estoy realizando una pagina web y el top de esta consta con tres divs para los cuales los divs de la derecha ...
  #1 (permalink)  
Antiguo 19/08/2011, 16:44
Avatar de gabriel720  
Fecha de Ingreso: febrero-2007
Ubicación: Guatemala
Mensajes: 96
Antigüedad: 9 años, 9 meses
Puntos: 1
divs para el background

hola a todos, estoy realizando una pagina web y el top de esta consta con tres divs para los cuales los divs de la derecha e izquierda quiero poner una imagen de fondo que se vaya repitiendo para que se ajuste a las distintas resoluciones que sea, el problema es que no se como hacer para que solito el div se vaya agrandando para que se vaya ajustando ya que si le pongo una medida no se ajusta si hay otra resolucion, este es el codigo

body {
font: 90% Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
}

.left {
float:left;
background:url(../images/cl.png);
background-repeat:repeat-x;
height:190px;

}

.top {
margin:auto;
width:890px;
background:url(../images/top.png);
padding-top:190px;
}

.right {
float:right;
background:url(../images/cl.png);
background-repeat:repeat-x;
height:190px;
}
  #2 (permalink)  
Antiguo 19/08/2011, 17:02
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 8 años, 5 meses
Puntos: 1008
Respuesta: divs para el background

prueba con este script
Cita:
<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Page</title>
<style type="text/css">
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
position: relative;
}
#contenedor {
width: 1280px; /* cambiar esta medida según el ancho del monitor en el que se pruebe */
height: 80%;
position: absolute;
left: 50%;
top: 0;
margin-left: -640px; /* la mitad del width en negativo */
}
#izquierdo {
position: absolute;
left: 0;
top: 0;
width: 140px;
height: 100%;
background-color: blue;
}

#centro {
position: absolute;
left: 140px;
top: 0;
width: 1000px;
height: 100%;
background-color: yellow;
}


#derecho {
position: absolute;
right: 0;
top: 0;
width: 140px;
height: 100%;
background-color: blue;
}
</style>
</head>
<body>
<div id="contenedor">
<div id="izquierdo"></div>
<div id="centro">Texto</div>
<div id="derecho"></div>
</div>
</body>
</html>
  #3 (permalink)  
Antiguo 19/08/2011, 17:45
Avatar de gabriel720  
Fecha de Ingreso: febrero-2007
Ubicación: Guatemala
Mensajes: 96
Antigüedad: 9 años, 9 meses
Puntos: 1
Respuesta: divs para el background

Cita:
Iniciado por IsaBelM Ver Mensaje
prueba con este script
gracias por la respuesta, una cosa lo realize pero con una tabla y si funciona pero se puede hacer sin necesidaad que sea una tabla de ley???

este es el codigo

html:

<body class="thrColFixHdr">
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td class="left"></td>
<td width="890"><img src="images/top.png" width="890" height="190" /></td>
<td class="right"></td>
</tr>
</table>

</body>


css:
body {
font: 90% Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
}

.left {

background:url(../images/cl.png);
background-repeat:repeat-x;

}

.top {
margin:auto;
width:890px;
background:url(../images/top.png);
height:190px;
}

.right {
background:url(../images/cl.png);
background-repeat:repeat-x;

}
  #4 (permalink)  
Antiguo 20/08/2011, 06:26
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 8 años, 5 meses
Puntos: 1008
Respuesta: divs para el background

Cita:
Iniciado por gabriel720 Ver Mensaje
gracias por la respuesta, una cosa lo realize pero con una tabla y si funciona pero se puede hacer sin necesidaad que sea una tabla de ley???
no le encuentro sentido a lo que dices. para que maquetar con tablas?? puedes hacer que unos bloques se comporten como tablas, usando una serie de valores que se le asigna a la propiedades display (table, table-row, table-cell, ...)

Etiquetas: divs, fondo
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 09:54.