[OSX / Chrome] Website ziet er in niet uit

[Verwijderd]

De website*snip* (en de andere sites genoemd op deze site) worden in Chrome (OSX) niet goed getoond. De midden kolom schuift over de linker kolom heen.
In Safare, Firefox, IE en zelfs op Chrome op een Windows PC ziet de site er perfect uit.

Bijgevoegd hoe de site er in Chrome uit ziet


Waarom toont de site niet goed in Chrome?

[ Voor 6% gewijzigd door RobIII op 04-06-2012 22:39 ]

[crisp]

Misschien omdat er nog wat structuele foutjes in zitten: http://validator.w3.org/c...w.crimecityfriends.com%2F ?

sowieso is dat het eerste wat je bij dergelijke problemen dient te checken..

[ Voor 24% gewijzigd door crisp op 04-06-2012 22:42 ]

[RobIII]

Ik heb de link verwijderd (spam); een plaatje en een stukje relevante(!) code voldoet prima om je punt duidelijk te maken. Dit is niet heel veel meer dan een Kan iemand even...? vertellen wat ik fout doe en daar doen we hier niet aan. Zéker niet als we niet zien wat je zélf al geprobeerd/gezocht/gevonden hebt; zie daarvoor ook onze Quickstart

Verder: je screenshot werkt niet; ook niet als ik de url "corrigeer". Nu opeens wel

Anyways; als je je topicstart aanvult met de relevante informatie (zie voorgenoemde quiockstart) dan wil ik dit topic nog wel een kans geven.

[ Voor 11% gewijzigd door RobIII op 04-06-2012 22:57 ]

[Verwijderd]

Ik heb de site al door de Validator van W3 gehaald en zeer veer gegoogled. Het meest vreemde is dat ik op een ander forum terug kreeg dat iemand het op een Apple wel correct in Chrome zag. De opmaak is 3 kolom css met in het midden een tabel. Kan dat laatste de ellende veroorzaken. Het vreemde is dat volgens mij Safari dezelfde basis heeft als Chrome en daarin zie je de pagina wel correct.

[RobIII]

Verwijderd schreef op maandag 04 juni 2012 @ 23:22:
Kan dat laatste de ellende veroorzaken.

Een vergeten puntkomma kan al ellende veroorzaken. Wat jij moet doen is een testcase maken waarin je je op een enkel probleem per keer kunt focussen. Strip je HTML/CSS tot de bare-bones en vul ze weer stukje bij beetje tot je probleem optreedt. Of andersom: blijf strippen tot 't probleem weg is. De laatste wijziging die je doorvoert is de troublemaker. En dat kun je dan weer isoleren in een aparte testcase met énkel de boosdoener om daarna gericht naar een oplossing te kunnen zoeken/googlen of om zelfs die testcase hier aan ons (of elders) te presenteren. Daarmee voorkom je dat anderen, maar ook jezelf, door de bomen 't bos niet meer zien en heb je een clear-cut probleem dat je zo kunt voorleggen en kunt aanwijzen waar 't pijnpunt in zit.

En wat crisp hierboven (en inmiddels onder ) me zegt; die validator wijst ook al wat kant-en-klare pijnpunten aan die je zo maar hoeft op te lossen (maar een beetje devver komt er zonder validator ook uit, vandaar dat ik je de werkwijze om zo'n probleem te tackelen probeer uit te leggen i.p.v. blind op een validator af te gaan ).

[ Voor 15% gewijzigd door RobIII op 04-06-2012 23:36 ]

[crisp]

Verwijderd schreef op maandag 04 juni 2012 @ 23:22:
Ik heb de site al door de Validator van W3 gehaald en zeer veer gegoogled. Het meest vreemde is dat ik op een ander forum terug kreeg dat iemand het op een Apple wel correct in Chrome zag. De opmaak is 3 kolom css met in het midden een tabel. Kan dat laatste de ellende veroorzaken. Het vreemde is dat volgens mij Safari dezelfde basis heeft als Chrome en daarin zie je de pagina wel correct.

Versies van de onderliggende HTML parser en renderengine kunnen wel degelijk verschillen, en daarmee in bepaalde gevallen ook hoe wordt omgegaan met mallformed HTML. Fix dus eerst in ieder geval die errors die dergelijk gedrag kunnen veroorzaken zoals:

Line 100, Column 4: end tag for element "P" which is not open
Line 132, Column 1: unclosed start-tag requires SHORTTAG YES
Line 147, Column 73: end tag for "TR" which is not finished

[Emgeebee]

Die tabel in het midden ziet er op het eerste gezicht prima in orde uit. Ik zie alleen geen <tr> tags staan in die grote tabel, misschien doet dat het trucje wel. (al betwijfel ik het.)

Verder twee dingen:

- Je sluit je <p> elementen niet af;
- <div align="center", hier moet nog een > achter.

[ Voor 26% gewijzigd door Emgeebee op 04-06-2012 23:42 ]

[Verwijderd]

Dank voor de snelle reacties. Weer een leuke taak om morgenavond op te pakken Inderdaad terug werken naar het pijnpunt klinkt als een goede manier om het probleem te achterhalen

[Verwijderd]

Probleem zat hem in het verkeerd plaatsen van de <div id="wrap">
Bedankt voor de suggesties

[BtM909]

Volgende keer goed luisteren naar ome crisp

Overigens ook voor de volgende keer: als je binnen 24uur een reactie wilt toevoegen en je bent de laatste poster, pas dan je laatste reply aan