[PHP/CSS] tables werken niet

[quakerix]

Beste tweakers,

Inleiding: Ik hep al eerder met CSS, HTML en PHP gewerkt. Had netjes CSS gebruikt bij enkele dingen, vooral text. Maar had nog veel via HTML lopen aangezien veel dingen uit de database(background,colors,etc) kwam.

Doel: Nu las ik dat PHP en CSS in combinatie werkt! Hee dat leek me leuk, dan had ik een CSS file waarin de background-urls, color etc. uit de dabase worden gehaald en direct in de CSS terecht komen. Had wel wat cache problemen, maja.. wou het wel proberen. Had ergens op tweakers een post gevonden hoe deze persoon het gedaan had.

Ik dacht het aan de praat had gekregen aangezien ik een CSS file had (system_css.php) waarin de background van de gehele site werd verandert. Ik was nog niet aan het database gedeelte gekomen.. maja, eerste ff beetje spelen etc.


Probleem: Dus ik d8 dat het allemaal werkte, totdat ik in m'n CSS file wat table eigenschappen wou veranderen. NOT dat werkte dus ff niet. Ik deed zelf de background-color: Blue; en er gebeurde maar niets. Terwijl de CSS 'schijnt' te werken..

Nu is het zo, dat als ik de style direct in de HTML pagina plakt, dat hij het "WEL" doet. Maar waarom niet in de php/css combi file? Bedoel, de site background werkt? waarom niet de table eigeschappen?

Files:

HTML file: http://def.eghost.nl/index.php
CSS/PHP file: http://def.eghost.nl/system/system_css.php

CSS/PHP file:

code:

<?php header('Content-type: text/css'); ?>
<style>
.tableX {
  width : 980;
  margin-right : auto;
  margin-left : auto;
  margin: auto 0 ;
  background-color : Blue;
}
#table-header { }
#table-header-menu { }
#table-header-menu-right { }
#table-header-menu-left { }
#table-header-image { }
#table-index { }

#site-body {   
  background: url(../images/test.jpg) no-repeat fixed center; 
}
</style>

Al getryed:

Ben geen CSS pro, maar al genoeg op IRC /amsg's gedaan en niemand wist het

- eerste had ik in m'n CSS file: .tableX en @ HTML: id="tableX"
- daarna had ik in m'n CSS file:: #tableX en @ HTML: class="tableX"

en nog veel meer dingetjes getryed..

[DR]

haal die <style> en </style> weg uit je css file.

[André]

. is voor classes
# is voor id's

En de <style> tags kun je weglaten.

[quakerix]

ARGH !!! het waren die 2 <style> </styles>

terwijl ik ze van een voorbeeld heb! OMFG OMFG, zoveel getryed..

[ Voor 21% gewijzigd door quakerix op 05-11-2004 23:05 ]

[quakerix]

André schreef op 05 november 2004 @ 22:54:
. is voor classes
# is voor id's

En de <style> tags kun je weglaten.

wat is het verschil tussen classes/id's?

ik gebruik classes voor TEXT en ID's voor tables? maar weet eigenlijk niet waarom.

[crisp]

een ID is om 1 element in een document uniek te IDentificeren, een class gebruikt je om bepaalde style-kenmerken op meerdere elementen in een document toe te kunnen passen.

En je moet niet op IRC amsg'en maar gewoon een CSS tutorial doornemen, bijvoorbeeld op http://www.w3schools.com/css

[ Voor 26% gewijzigd door crisp op 05-11-2004 23:03 ]

[quakerix]

crisp schreef op 05 november 2004 @ 23:02:
een ID is om 1 element in een document uniek te IDentificeren, een class gebruikt je om bepaalde style-kenmerken op meerdere elementen in een document toe te kunnen passen.

En je moet niet op IRC amsg'en maar gewoon een CSS tutorial doornemen, bijvoorbeeld op http://www.w3schools.com/css

a thx,

euhm.. m'n table wilt niet gecenterd worden terwijl ik juist uit een ander TWEAKER topic had gehaald dat het met dat margin moest.

maar dat werkt niet bij mij? Anybody?

[dev icey]

code:

#container {
 margin: auto;
}

?

hij moet zich natuurlijk wel vrij kunnen bewegen, dus niet in een andere div die zo klein is dat deze div niet gecentered kan worden.

[ Voor 76% gewijzigd door dev icey op 05-11-2004 23:09 ]

[crisp]

CSS centreren:

Cascading Stylesheet:

body {
  text-align: center;
}

#container {
  position: relative;
  width: 760px;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}

en uit jouw CSS:

Cascading Stylesheet:

width : 980;

980 wat? appels? konijnen? pixels misschien?

en waarom al die tabellen?

[ Voor 5% gewijzigd door crisp op 05-11-2004 23:11 ]

[Wolfboy]

Je mag ID maar 1x gebruiken per pagina en classes kan je zovaak gebruiken als je wilt.
Voorbeeld [code]<style type="text/css">
.divclass{
width:100px;
height:100px;
background-color:#f00;
}

#div2{
background-color:#0f0;
}
</style>
<div id="div1" class="divclass">foo</div>
<div id="div2" class="divclass">foo</div>[/]
_{Pseudocode, zonder positionering zal het niet zo heel erg duidelijk zichtbaar zijn}

offtopic:
Spuit 20 ofzo ik moet voortaan eerst op F5 rammen voordat ik een reactie tik na een topic 15min open hebben staan

[ Voor 24% gewijzigd door Wolfboy op 05-11-2004 23:10 ]

[quakerix]

euHM, nu snap ik hem ff niet:

.tableX en id=tableX doet niets het.
#tableX en id=tableX doet de "margin" het niet van de table en de width wel
#tableX en class=tableX doet niets het.
.tableX en class=tableX doet de "margin" het niet van de table en de width wel

[dev icey]

#style -> <div id='style'>Div1</div>
.style2 -> <div class='style'>Div1</div><div class='style'>Div2</div>

Id's (#) mag je dus maar voor 1 element gebruiken. Classes (.) mag je voor meerdere elementen gebruiken.

[quakerix]

crisp schreef op 05 november 2004 @ 23:09:
(....)
980 wat? appels? konijnen? pixels misschien?

en waarom al die tabellen?

ja sorry, de px is door het vele editen weg gevallen.

code:

#tableX {
  width : 980px;
  position: relative;
  margin : auto;
  margin-right : auto;
  margin-left : auto;
}

HTML:

code:

<table border="1" cellspacing="1" cellpadding="0" id="tableX">

[ Voor 27% gewijzigd door quakerix op 05-11-2004 23:14 ]

[crisp]

die eerste margin: auto kan je weglaten
verder moet je het containing element van #tableX nog een text-align: center geven wil je het goed werkend hebben in IE

maar als je het echt goed wilt doen moet je geen tabellen gebruiken voor layout

[ Voor 24% gewijzigd door crisp op 05-11-2004 23:17 ]

[dev icey]

quakerix schreef op 05 november 2004 @ 23:14:

code:

#tableX {
  width : 980px;
  position: relative;
  margin : auto;
  margin-right : auto;
  margin-left : auto;
}

Waarom doe je margin, margin-right en margin-left. Margin is al een shortstate voor margin-top, margin-bottom, margin-left, margin-right.

crisp schreef op 05 november 2004 @ 23:02:
En je moet niet op IRC amsg'en maar gewoon een CSS tutorial doornemen, bijvoorbeeld op http://www.w3schools.com/css

[ Voor 19% gewijzigd door dev icey op 05-11-2004 23:18 ]

[quakerix]

crisp schreef op 05 november 2004 @ 23:16:
die eerste margin: auto kan je weglaten
verder moet je het containing element van #tableX nog een text-align: center geven wil je het goed werkend hebben in IE

maar als je het echt goed wilt doen moet je geen tabellen gebruiken voor layout

Werkt nog steeds niet,

margin : auto; alleen getryed : werkt niet
margin-left: auto; + margin-right : auto; getryed : werkt niet

position: relative;
text-align: center;

heb ik erbij gezet, maar werkt nog steeds niet.

[quakerix]

dev icey schreef op 05 november 2004 @ 23:17:
[...]


Waarom doe je margin, margin-right en margin-left. Margin is al een shortstate voor margin-top, margin-bottom, margin-left, margin-right.


[...]

Ja i know, ik hep inmiddels zoveel getryed.. los of bij elkaar werkt allemaal niet.

[crisp]

crisp schreef op 05 november 2004 @ 23:16:
die eerste margin: auto kan je weglaten
verder moet je het containing element van #tableX nog een text-align: center geven wil je het goed werkend hebben in IE

maar als je het echt goed wilt doen moet je geen tabellen gebruiken voor layout

zo duidelijker?

vertaling: het element waar #tableX zelf dus inzit

[ Voor 16% gewijzigd door crisp op 05-11-2004 23:24 ]

[quakerix]

crisp schreef op 05 november 2004 @ 23:23:
[...]

zo duidelijker?

vertaling: het element waar #tableX zelf dus inzit

ik schaam me kapot, maar ik begrijp je niet. Heb text-align : center; bij tableX toegevoegd. Maar euhm, dnk niet dat je dat bedoeld aangezien het niet werkt.

[crisp]

#tableX zit in je body
ergo:

Cascading Stylesheet:

body {
  text-align: center;
}

[quakerix]

crisp schreef op 05 november 2004 @ 23:30:
#tableX zit in je body
ergo:

Cascading Stylesheet:

body {
  text-align: center;
}

ik moet met DIV's aan de gang gaan, i know. Dat wordt eGhost v3

[ Voor 7% gewijzigd door quakerix op 05-11-2004 23:32 ]

[gorgi_19]

Heel veel HTML en CSS zaken; allemaal voor de buren

* gorgi_19 knikkert het topic naar Webdesign & Graphics

[Verwijderd]

terwijl ik ze van een voorbeeld heb! OMFG OMFG, zoveel getryed..

Welk voorbeeld? Deze fout komt veel te vaak voor. Elk voorbeeld dat er bestaat kan een e-mail gebruiken.