[PROBLEMA] vincular hoja de estilos a php!!! ayuda!!!

fcdragons · #1 (**permalink**) 08/01/2009, 15:33

Hola, quiero vincular un .css a un .php, el problema es el siguiente, me cambia el fondo del body, pero es como si los divs no tuvieran diseño... aqui les muestro el archivo index.php que es donde estan los divs!

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>Documento sin t&iacute;tulo</title>
<link href="/includes/design.css" rel="stylesheet" type="text/css" />

</head>

<body>
<div align="center">
<div id="wrapper" class="wrapper">
<div id="branding">
</div>
<div id="navright" class="navright">
aa
</div>
<div id="content" class="content">
aa
</div>
<div id="navleft" class="navleft">
aa
</div>
</div>
</div>
</body>
</html>

Y ahora les adjunto el codigo css:

Código:

@charset "utf-8";
/* CSS Document */


body {background-color:#F0F0F0;text-align:center;}
.wrapper #wrapper {width:1260px;}
.content #content {float:left;background-color:#FFFFFF;width:890px;}
.navleft #navleft {float:left;background-color:#FFFFFF;width:180px;}
.navright #navright {float:left;background-color:#FFFFFF;width:180px;}

El codigo que vincula la hoja de estilos al php es la siguiente:
<link href="/includes/design.css" rel="stylesheet" type="text/css" />

espero y me puedan ayudar

DragonX · #2 (**permalink**) 08/01/2009, 16:12

y si haces tu enlace absoluto? lo probaste?

fcdragons · #3 (**permalink**) 08/01/2009, 17:01

Hacerlo absoluto, como sería eso? Es que yo nosé que quieres decir con absoluto

webosiris · #4 (**permalink**) 08/01/2009, 17:10

a ver... no te esta dando estilos en los divs porque tu css esta mal.... analiza lo que estas diciendo en tu css:

Cita:

.wrapper #wrapper

eso es un elemento con id="wrapper" que es hijo (osea que esta adentro) de otro elemento con class="wrapper"

tu no tienes eso en tu html.... lógico que no te funcione.

otra cosa:
- elimina el div que dice "align=center", eso no se hace así... si queres centrar el div "wrapper" usa margin:auto en el css.
- si los 3 divs dentro del wrapper van a tener fondo blanco, dale el fondo blanco al wrapper en vez de a los 3 divs
- si las 2 columnas laterales van a ser iguales, elimina los ids y referencialas con la misma clase
- el ancho del wrapper te va a producir scroll horizontal en el 70% de las pantallas... no todo el mundo usa monitores de 19"

poison_mayer · #5 (**permalink**) 08/01/2009, 17:27

El problema está en tu CSS trabaja solo con los ID (#) no hagas esto .wrapper #wrapper {***} sino solo esto #wrapper {***}

fcdragons · #6 (**permalink**) 08/01/2009, 17:37

Cita:

Iniciado por poison_mayer

El problema está en tu CSS trabaja solo con los ID (#) no hagas esto .wrapper #wrapper {***} sino solo esto #wrapper {***}

Eso ya lo intente pero no da resultado...

Cita:

Iniciado por webosiris

a ver... no te esta dando estilos en los divs porque tu css esta mal.... analiza lo que estas diciendo en tu css:eso es un elemento con id="wrapper" que es hijo (osea que esta adentro) de otro elemento con class="wrapper"

tu no tienes eso en tu html.... lógico que no te funcione.

otra cosa:
- elimina el div que dice "align=center", eso no se hace así... si queres centrar el div "wrapper" usa margin:auto en el css.
- si los 3 divs dentro del wrapper van a tener fondo blanco, dale el fondo blanco al wrapper en vez de a los 3 divs

- si las 2 columnas laterales van a ser iguales, elimina los ids y referencialas con la misma clase
- el ancho del wrapper te va a producir scroll horizontal en el 70% de las pantallas... no todo el mundo usa monitores de 19"

con lo primero que me dijiste no entendí... Todos tienen fondo blanco porque lo adornare después con imágenes y grax por decirme lo de la scroll horizontal xD

(es chungo escribir en el ipod xD)

Y lo de los navs no son iguales cambia el float

willyfc · #7 (**permalink**) 08/01/2009, 18:25

yo digo, no será mejor de esta manera?, claro según el ejemplo que colocaste en tu primer post

Código:

body {background-color:#F0F0F0}
#wrapper {width:100%; height:auto; display:table; margin:0 auto; background-color:#FFFFFF}
#content {float:left;background-color:#FFFFFF;width:60%}
#navleft {float:left;background-color:#FFFFFF;width:20%;}
#navright {float:left;background-color:#FFFFFF;width:20%}

Código HTML:

<body>
<div id="wrapper">
<div id="branding">
</div>
<div id="navright">
  <p>aa</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  </div>
<div id="content">
  <p>aa</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp; </p>
</div>
<div id="navleft">
  <p>aa</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp; </p>
</div>
</div>
</body>

webosiris · #8 (**permalink**) 08/01/2009, 19:01

Cita:

Iniciado por fcdragons

con lo primero que me dijiste no entendí

en tu css escribistes esto:

Código:

.wrapper #wrapper{}

eso se corresponde con este html:

Código HTML:

<div class="wrapper">
   <div id="wrapper"></div>
</div>

osea un div con id="wrapper" que es hijo de un div con class="wrapper". Tu html no tiene esa estrucutra por lo que evidentemente no te va a funcionar

fcdragons · #9 (**permalink**) 09/01/2009, 00:52

aaa ok y ahora lo pruebo willyfc

fcdragons · #10 (**permalink**) 09/01/2009, 00:56

willy eso me crea 3 divs iguales de grandes y uno debajo de otro, yolo que quiero es un contenido en medio y un nav a cada lado...

fcdragons · #11 (**permalink**) 09/01/2009, 01:03

ya lo hice SOLUCIONADO, en vez de ids lo use todo con clases!!! xD perdon la molestia le kite el id todo y le puse .wrapper en la hoja de diseño bueno grax de veras sin vosotros no habria encontrado l error ^^