duda Vista aplicacion web (html/css)

Saiko9

Buenas,

Tengo una duda ya que soy malísimo en html y css:

La cosa es que estoy haciendo una pagina web que tiene el típico container central donde muestro el contenido (como en mv o en cualquier pagina) y este se alarga. Lo que quiero hacer entonces fijándonos en la pagina de mv que es igual es hacer para la cabecera del background una parte de otro color (igual que en MV), vamos una caja o algo de otro color que este detrás del container principal solo para que sea mas bonito.

Como lo hago? supongo que si hago un <div> en el body con ese background-color moveré el container principal y se me joderá.

he probado a meter esto sobre la css de el body:

background: rgba(20,20,20,0.36);
background: -moz-linear-gradient(top, rgba(20,20,20,0.36) 0%, rgba(20,20,20,1) 0%, rgba(20,20,20,1) 23%, rgba(13,13,13,1) 24%, rgba(64,64,64,1) 24%, rgba(54,54,54,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(20,20,20,0.36)), color-stop(0%, rgba(20,20,20,1)), color-stop(23%, rgba(20,20,20,1)), color-stop(24%, rgba(13,13,13,1)), color-stop(24%, rgba(64,64,64,1)), color-stop(100%, rgba(54,54,54,1)));
background: -webkit-linear-gradient(top, rgba(20,20,20,0.36) 0%, rgba(20,20,20,1) 0%, rgba(20,20,20,1) 23%, rgba(13,13,13,1) 24%, rgba(64,64,64,1) 24%, rgba(54,54,54,1) 100%);
background: -o-linear-gradient(top, rgba(20,20,20,0.36) 0%, rgba(20,20,20,1) 0%, rgba(20,20,20,1) 23%, rgba(13,13,13,1) 24%, rgba(64,64,64,1) 24%, rgba(54,54,54,1) 100%);
background: -ms-linear-gradient(top, rgba(20,20,20,0.36) 0%, rgba(20,20,20,1) 0%, rgba(20,20,20,1) 23%, rgba(13,13,13,1) 24%, rgba(64,64,64,1) 24%, rgba(54,54,54,1) 100%);
background: linear-gradient(to bottom, rgba(20,20,20,0.36) 0%, rgba(20,20,20,1) 0%, rgba(20,20,20,1) 23%, rgba(13,13,13,1) 24%, rgba(64,64,64,1) 24%, rgba(54,54,54,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#141414', endColorstr='#363636', GradientType=0 );

Al hacerlo consigo el efecto deseado pero la franja se vuelve mas larga verticalmente dependiendo del contenido del container no se por qué si lo estoy aplicando al body.

PD: aunque lo que he puesto seaun gradient con un color básico estatico me vale.

eXtreM3

Anídalos así:

html
--- body
------ bloque central
--------- cabecera (menú)
--------- bloque principal (noticias, posts...)
------ cierras bloque central
--- cierras body
cierras html

El importante es el bloque central, si miras el código de mv, es el equivalente al "div id content", basta con ponerle un ancho definido (1000px por ejemplo) y margin: 0 auto.

1 respuesta
Saiko9

#2 vale , gracias probaré. Miré la estructura del html y la verdad que es un poco chapuza(no la hice yo) así que haré lo que dices.

Usuarios habituales

  • Saiko9
  • eXtreM3