Foros del Web » Creando para Internet » CSS »

Problemas con background, contenido y CSS

Estas en el tema de Problemas con background, contenido y CSS en el foro de CSS en Foros del Web. Resulta que hace menos de una semana que estoy configurándome mi futura web. Me ha costado Dios y ayuda el centrarla (lo siento... estoy verde ...
  #1 (permalink)  
Antiguo 16/12/2009, 05:13
 
Fecha de Ingreso: diciembre-2009
Mensajes: 3
Antigüedad: 14 años, 11 meses
Puntos: 0
Problemas con background, contenido y CSS

Resulta que hace menos de una semana que estoy configurándome mi futura web. Me ha costado Dios y ayuda el centrarla (lo siento... estoy verde en CSS ). Me estoy peleando con las hojas de estilo layout.css y stile.css.

Debo decir que la web que me estoy haciendo está hecha bajo Drupal.

El caso es que, después de centrar la web, quiero colocar una imagen de fondo expandida (de color azul), pero es que cuando la coloco para que la imagen se repita, la imagen se repite... pero por toda la jodida página dejándomela toda en azul, y quiero que sólo aparezca en azul los márgenes y el contenido (donde irán los post) quiero que siga el blanco como color de fondo.

Para explicarme mejor pongo un pantallazo:



Aquí está el layout.css al completo:

Código:
/* $Id: layout.css,v 1.5.4.1 2008/11/04 13:45:26 madmaks Exp $ */
/* SpreadFirefox v2 */
/*<group=Structural>*/
html, body
	{

div.web{

width : 86%;

margin-left : 7%;

}

	margin				: 20px;
	padding				: 0px;
	color				: #000;
	background-color	        : #fff;
	background			: url(images/bg_head.gif) repeat-x;
	}
/* bizarrely IE6 seems to want to shift to the right by 3px
Could hack to shift everything else back but it looks ok */
body
	{
	margin				: 0px;
	padding				: 20px;
	}

* html>body
	{
	margin-right		: -3px; /* margin - 3px for IE */
	}

div
	{
	border				: 0;
	margin				: 0px;
	padding				: 0px;
	}

#wrapper1 {
	min-width: 710px;
	max-width: 900px;
    }

#wrapper1, #wrapper2
	{
	margin				: 0 auto;
	padding				: 0px;
	}

/* NN4 makes a mess of the backgrounds (positioning plus unintended inheritance) so exclude it. OmniWeb doesn't understand background positioning either - the left column can be achieved, but not the right one */
#wrapper1
	{
	/*/*/
/*	background-image	: url(images/bg_right.png); 
	background-position	: right top;
	background-repeat	: repeat-y;*/
	/* */
	}
#wrapper2
	{
	/*/*/
/*	background-image	: url(images/bg_left.png);
	background-repeat	: repeat-y;*/
	/* */
	}

.header
	{
	margin				: 0px;
	padding				: 0px;
	color				: #000;
	background-color	: transparent;
	border				: 0;
	}
/* IE5 needs shifting up - and #empty to clear its parsing palette */
* html body .header
	{
	margin-bottom		: -19px;
	font-family			: "\"}\"";
	font-family			: inherit;
	margin-bottom		: 0px;
	}
#empty{}

/* -1px margin-top is so NN4 borders overlap */
.columns
	{
	margin		: 0px;
	margin-top	: -1px;
	padding		: 0px;
	border		: solid 1px #000;
	color		: #000;
	background-color: #fff;
	}
/* reset post NN4 */
.columns
	{
/*/*/
	border		: none;
	margin-top	: 0px;
	background-color: transparent;
	/* background: url(images/bg_sidebar_box_bottom.png) top repeat-x; */
/* */
	}

/*
make sure that .leftcolumn's width is equal to .centercolumn's margin-left
-11px margin-top enables columns to lign up in NN4 rather than dropping down unacceptably
*/
.leftcolumn
	{
	float				: left;
	left				: 0px;
	width				: 150px;
	margin				: 0px;
	margin-top			: -11px;
	padding				: 0px;
	}
/* reset post NN4 */
.leftcolumn
	{
/*/*/
	margin-top			: 0px;
/* */
	}

/*
make sure that .rightcolumn's width is equal to .centercolumn's margin-right
*/
.rightcolumn
	{
	position			: static;
	float				: right;
	width				: 247px;
	margin				: 0px;
	padding				: 0px;
	}


/* .centercolumn base settings
====================================
These values allow the three columns to butt up against each other
You can change the margins between them either by altering these values. However, in most cases altering the padding property of the .[$column]padding selectors will be simpler and more effective.
------------------------------------
NN4
------------------------------------
margin-left		: -25px
margin-right	: 0px
margin-top		: -1px
If you must change these, experiment with these values extensively since the center column does not move in a direct one-to-one relationship to the value specified here. The margin-top of -1px is needed to make NN4 line up correctly.
------------------------------------
OmniWeb
------------------------------------
margin-left		: 0px;
margin-right	: 0px;
------------------------------------
Other browsers
------------------------------------
margin-left		: width of .leftcolumn
margin-left		: final width of .rightcolumn
margin-right is set to the value of the overriding values for .rightcolumn's width.
*/
.centercolumn
	{
	margin			: 0px;
	padding			: 0px;
	}
/* OmniWeb value - others in external css file */

/* no they're not - they're here for ease of viewing for the moment */
/* NN4 values */
.centercolumn
	{
	margin-right		: 0px;
	margin-left		: -5px;
	}
/* Other browsers */
/*/*/
.centercolumn
	{
	margin-right		: 247px;
	margin-left		: 150px;
	}
/* */

/* OmniWeb (exclude from IE5 mac) */
/*\*/
.fake.centercolumn
	{
	margin-right		: 0px;
	margin-left		: 0px;
	}
/* reset IE*/
* html body .centercolumn
	{
	margin-right		: 247px;
	margin-left		: 150px;
	}


/* -7px margin-top enables footer/middles to lign up in NN4 rather than dropping down unacceptably */
.footer, .middle
	{
	clear				: both;
	margin				: 0px;
	margin-top			: -7px;
	padding				: 6px;
	text-align			: center;
	color				: #ddd;
	background-color	: transparent;
	border				: 0;
	}
/* reset post NN4 */
.footer, .middle
	{
/*/*/
	margin-top			: 0px;
/* */
	}

.headerpadding, .centerpadding
	{
	margin				: 0px;
	padding				: 0px;
	}
.leftpadding, .rightpadding
	{
	margin				: 0px;
	padding				: 0px;
	}
.rightpadding {
    padding-left: 0; 
    }
.centerpadding {
    padding-left: 20px; 
    padding-right: 20px; 
    }
Muchísimas gracias por leer este mensaje y a los que se tomen la molestia de contestar.

A quién me ayude le estaré eternamente agradecido.
  #2 (permalink)  
Antiguo 16/12/2009, 08:10
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 10 meses
Puntos: 306
Respuesta: Problemas con background, contenido y CSS

Hola

No veo donde le pones el background al body, al menos en esta hoja de estilos no aparece.

Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #3 (permalink)  
Antiguo 16/12/2009, 08:24
 
Fecha de Ingreso: diciembre-2009
Mensajes: 3
Antigüedad: 14 años, 11 meses
Puntos: 0
Respuesta: Problemas con background, contenido y CSS

Cita:
Iniciado por C2am Ver Mensaje
Hola

No veo donde le pones el background al body, al menos en esta hoja de estilos no aparece.

Saludos
Muchísimas gracias por responder.

Pues después de mucho probar, veo que el background aparece dentro del DIV quedando esa parte como sigue:

Código:
div
	{
        background-color             :#ffffff;
	border				: 0;
	margin				: 0px;
	padding				: 0px;
	}
Lo que ocurre es que, después de modificar el CSS, la página me queda así:



Sobra decir que lo que quiero hacer es quitarle esas dos feas franjas blancas que me aparecen en el banner de cabecera y en el menú derecho.

¿Tengo que añadir algún código al DIV?

Gracias anticipadas.
  #4 (permalink)  
Antiguo 16/12/2009, 08:32
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 10 meses
Puntos: 306
Respuesta: Problemas con background, contenido y CSS

Si la tienes subida pon el link de esta forma: tupagina.html sin las www.
Si no, pon el código html.
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #5 (permalink)  
Antiguo 16/12/2009, 08:54
 
Fecha de Ingreso: diciembre-2009
Mensajes: 3
Antigüedad: 14 años, 11 meses
Puntos: 0
Respuesta: Problemas con background, contenido y CSS

Cita:
Iniciado por C2am Ver Mensaje
Si la tienes subida pon el link de esta forma: tupagina.html sin las www.
Si no, pon el código html.
La página está bajo Drupal y no hay manera de pasar dicho código a html o al menos yo lo sé hacer.

El enlace completo es:

http://www.culturismoclasico.com/web

Gracias por responder y dime si te hace falta algo más.
  #6 (permalink)  
Antiguo 16/12/2009, 09:31
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 10 meses
Puntos: 306
Mensaje Respuesta: Problemas con background, contenido y CSS

El cuadrado blanco en el header es este div:

Código HTML:
<div id ="region_header"></div> 
Y el cuadrado blanco en el menu derecho es:
Código HTML:
<div><strong><font color="#ffffff">SECCIONES</font></strong></div> 

El css de region_header está en el style.css

Código HTML:
#region_header {
  position: absolute;
  left: 120px;
  top: 2px;
  margin: 0px;
  padding: 0px;
  width: 468px;
  height: 60px;
  border: none;
  color: #fff; 
}
pero como no tiene definido el background toma el que hiciste mención antes, es decir
Código HTML:
div
	{
        background-color             :#ffffff;
	border				: 0;
	margin				: 0px;
	padding				: 0px;
	}
Yo le sacaría el background-color a este último, ya que lo que dice es que a TODOS los div le ponga un fondo blanco, PERO como solo afecta a dos div, es mejor modificar dichos div.

Solución posible
Dado que este div no contiene nada, creo, lo podrías eliminar, pero me dices que no tienes acceso al html, lo cual es muy loco porque tienes acceso al css.
entonces agrega esto y ves que pasa
Código HTML:
#region_header {

visibility: hidden;  

 position: absolute;
  left: 120px;
  top: 2px;
  margin: 0px;
  padding: 0px;
  width: 468px;
  height: 60px;
  border: none;
  color: #fff; 
}
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--

Última edición por C2am; 16/12/2009 a las 09:43
  #7 (permalink)  
Antiguo 16/12/2009, 10:00
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 10 meses
Puntos: 306
Respuesta: Problemas con background, contenido y CSS

Bien, hasta aquí mi ayuda.
No porque no quiera ayudarte, sino porque me parece que le sacarás mayor provecho si posteas o pides que te muevan al subforo de DRUPAL, ya que nunca lo he usado y me parece extraño que no puedas modificar el html, cosa que se debe poder, supongo.
Este es el link :
http://www.forosdelweb.com/f136/

Ahora, si consigues acceder al editor del html, no hay problema, porque solo es cuestión de modificar esos div en el documento html.

Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
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 22:45.