[Firefox <td>]On click wordt de TD verticaal smaller

[Simkin]

*** opgelost ***
------------------------------

Dag allemaal,

Ik heb een probleem dat de hoogte van een tabel colom, waarin een plaatje staat, net iets te hoog is. De hoogte zou zich automatisch moeten aanpassen aan de hoogte van het plaatje, dit gebeurd niet standaard. Wat het verhaal (voor mij) raar maakt is dat de grootte wel goed wordt geschaald zodra je erop klikt met de muis.

Standaard:


Na het klikken:

(de ruimte onder de onderste regel is nu weg)

Ik heb mijn CSS doorgespit op rare settings bij IMG of gebruikte classes maar kan niets vinden.
Ik kan dit probleem alleen met firefox reproduceren.

Voor een demo kan je het beste even op de site kijken en op de headline van een artikel klikken (of om de bron te bekijken).

Ik zie het niet, advies is welkom.

[ Voor 3% gewijzigd door Simkin op 03-03-2007 17:38 ]

[We Are Borg]

<inkopper>
Geen tabellen gemisbruiken voor lay-out
</inkopper>

Zelf zal ik altijd kijken naar vertical align en een vaste hoogte voor de TR. Heb je die dingen al geprobeerd ? Zou handig zijn als je al aangeeft welke dingen je al geprobeerd hebt en dat je de relevante code er voor ons tussenuit haalt. Niemand gaat hier graag door jouw codesoep spitten op zoek naar de relevante HTML en CSS

Succes

[Bartolomew85]

HTML:

...
<table cellpadding="0" cellpaspacing="0" width="100%">
    <tr>
        <td bgcolor="#ADD1D9" colspan="2"><span CLASS="subject" bgcolor="#ADD1D9">
<a href="http://www.feelinginbloom.nl/?p=81" rel="bookmark" title="Permanent Link: <img src='http://www.feelinginbloom.nl/wp-content/image-headlines/eb6b3716e4493245f7b190cabad6989a.png' alt='Marc Young rockt de Amsterdamse Sugar Factory 8 maart op VREEMD' width='482' height='41' />"><img src='http://www.feelinginbloom.nl/wp-content/image-headlines/eb6b3716e4493245f7b190cabad6989a.png' alt='Marc Young rockt de Amsterdamse Sugar Factory 8 maart op VREEMD' width='482' height='41' /></a>
</td></tr>
...

Cascading Stylesheet:

...
div.main_menu {
   width: 520px;
   background: \#fff00;
   text-align: center;
}

...

.subject {  
font-weight: bold; color: #000;
font-size: 15px;
font-family: verdana;
text-decoration:none;
}

}

Ik zie zo al enkele fouten staan:

1. cellpaspacing -> cellspacing
2. de 'title' heeft de verkeerde link, er staat nu een img-tag (ok, html-technisch gezien is het juist )
3. in de css-sheet staat een sluithaakje onderin teveel
4. in de css-sheet ga je onnodig escapen in bijv \#fff00
5. *edit: je sluit de geopende span-tag niet af. Als je dat wel doet is je probleem (bij mij) opgelost.

Als je nou eerst eens die fouten fixed, en dan je code terugbrengen totdat je de fout geisoleerd hebt (DEBUGGEN heet dat). Plaats dan die relevante code nog eens...

[ Voor 3% gewijzigd door Bartolomew85 op 02-03-2007 18:02 ]

[killercow]

Simkin schreef op vrijdag 02 maart 2007 @ 15:43:
Dag allemaal,

Ik zie het niet, advies is welkom.

Trek die zooi eens door een validator.


Voor css:

http://jigsaw.w3.org/css-validator

Voor html
http://validator.w3.org/

95% van de beginners problemen, of onduidelijkheden (het staat er toch echt zo, toch?) zijn gewoon opspoorbaar met validators.

Wat is uberhaupt het nut van je table? want volgens mij voeg je alleen maar ruis toe, en weinig echte functionaliteit die niet in een style tag op de A of img had gekunt.

[ Voor 17% gewijzigd door killercow op 02-03-2007 22:42 ]

[Simkin]

we are borg: je hebt helemaal gelijk, niet goed over nagedacht. Volgende post zal zeker duidelijker zijn.

Bartolomew85: Ik had het niet gezien, erg fijn dat je dat zo snel hebt gevonden. De ontbrekende span afsluiting was inderdaad het probleem. Tevens de typo eruit gehaald. Nogmaals bedankt!

Killercow: bedankt voor de tip!

[ Voor 78% gewijzigd door Simkin op 03-03-2007 17:32 ]