Hoi-hoi,
De
.firebugLayoutBoxParent en dergelijke die tecsman gevonden heeft, is geen style uit het stylesheet van de pagina, maar een tijdelijke style die er door Firebug is ingezet... *)
- Howcome? Er is éérst met Firebug gekeken, toen werd Firebug uitgezet, en toen is met de Webdeveloper gekeken naar de styles.
- Op zo'n manier krijg je de tijdelijke styles van Firebug erbij kado!

- Na gebruik van Firebug moet je altijd even de pagina refreshen, dan ben je daar van af.
Nu de streepjes.
Sherlock Holmes fase 1
Als eerste kan je inderdaad even in het gewone stylesheet kijken.
- Online gaat dat het makkelijkst met de Webdeveloper Toolbar: je klikt op de knop "CSS" en in het uitrolvakje op "View CSS". Dan komen alle stylesheets (als er meer zijn), plus een eventueel gebruikt styleblok in de <head> van de pagina, keurig onder elkaar te staan.
- Het begint met een rijtje "Embedded Styles" in de pagina zelf. Hm, ik had ook Firebug niet gerefreshed
, want dit is alleen maar een rijtje Firebug-styles. Even refreshen en dan opnieuw!
- Er is het gewone stylesheet www.toppages.nl/9999.css, een serie styles van facebook, en een stylesheet "Kh8H4M0Xcap.css".
- De laatste wordt niet opgevraagd door de pagina zelf.
- De facebook-styles ook niet, die zitten in een <iframe>, en daar zal het veel-letterige css ook vandaan komen. Vanwege het <iframe> is dit gescheiden van de normale css, dus daar hoeven we ons niet druk om te maken.
Blijft over de
www.toppages.nl/9999.css.
Als je die even in de browser opent, en met "zoeken op deze pagina" kijkt of er ergens het woord "dashed" in staat, kom je van een koude kermis thuis: in het hele stylesheet is geen gestreept bordertje te vinden!
Dit is het dus in elk geval niet. - Einde fase 1.
Sherlock Holmes fase 2
Nu kan
Firebug van pas komen (tabblad HTML).
Vanaf de <body> kan je achtereenvolgens alle elementen openklikken. Erboven zie je waar je zit.
- Het is wat opvalt is dat er twee keer een <div id="footer"> in zit. Twee keer dezelfde id op één pagina is verboden! - De eerste zal "header" moeten heten.
Aan de rechterkant in het Firebug-venster zie je steeds welke styles zijn gebruikt voor het element dat je aan de linkerkant hebt geselecteerd.
- Zo kan je het hele trappetje afdalen, tot je iets in een element tegenkomt dat de boosdoener kan zijn.
Aan het oplichten van de elementen kan je zien, dat het kwaad ofwel in de
<div class="bg"> moet zitten, ofwel in de
<div class="column1"> die daarbinnen zit.
- We beginnen met de inspectie van de <div class="bg">.
- Hé, daar zit een background-image in dat heet: dash.gif !
- Als je er met de muis in het rechter FB-venster overheen gaat zie je dat dit gif'je het formaat 741*7px heeft. Dat kan kloppen, want het streeplijntje staat een flink stuk vanaf de linkerkant.
Boosdoener in de kraag gevat!
- Nog een geluk dat hij "dash" in de naam had, want met bv "bg1507.gif" had je 'm niet zo gauw gevonden. :d
- Dat pleit er nog maar weer eens voor, om herkenbare namen als bestandsnamen te gebruiken.
Met vriendelijke groet,
CSShunter
__________
PS
Diagnose: 1,5 minuut.
*) Het kleurtje #E00 (= #EE000) is ook geen grijstint, weet m'n tekenprogramma te vertellen.
#BBBBBB is wel een grijstint, maar niet het grijs van de streepjeslijn.