IE reagerar fel på rowpan

Här är bilden som visar hur det ser ut i Internet Explorer.

Du får gärna redigera bort den onödiga texten, så man slipper scrolla i sidled.

Varför har du satt

table#tabell tr{
position: relative;
}

Kan du inte ta bort det?

Så enkelt?! Konstigt att den bara påverkade halva delen? men tack!

danii skrev:

Så enkelt?! Konstigt att den bara påverkade halva delen? men tack!

I och med att allt skulle placeras relativt så krånglade väl det till det. IE är inte så bra på att tolka CSS, det har vi ju kommit underfull med för länge sen. Men varför det bara påverkar en del överlåter jag åt någon annan.

En annan fråga. När jag sätter <tr bgcolor="#FBFBFB"> på alla tr så blir det ett tunnt vit mellanrum mellan alla tr och alla td. Hur fixar man detta (så att även den färgas)? Det är samma kod.

Jag ska inte ha färgen på hela tabellen. Utan på varannan vara så därför ska jag inte lägga in det på table.

Tackar

Hmm..

Hjälper CSS-koden

#tabell {border-collapse:collapse}

?

jarvklo skrev:

Hmm..

Hjälper CSS-koden

#tabell {border-collapse:collapse}

?

Absolut! Tackar

Hehehe, det här är sista frågan

Jag skapade en td som har värdet:

background-color: #dddddd;
height: 1px;

I IE så är den 1px hög. Men i Firefox är den ca 20px och det verkar inte som om man kan göra den mindre, utan endast större. Finns det någon "omväg"?

Hmm

*gissar nu*

Om du bara har tomrum i cellen, kanske det hjälper med någonting i stil (sorry - no pun intended ) med

height:1px; overflow:hidden

i CSS:en för cellen (förutsatt att cellen är ensam på raden förståss) ?

Hjälper inte det, får du nog visa upp lite mer av koden så att man slipper gissa

Tyvärr fungerade det ingte. Här är lite kod

<table id="tabell">
<tr bgcolor="#FBFBFB">
<td class="tabellBild" rowspan="3"
 bgcolor="#FBFBFB"><img src="bilder/2.jpg" /></td><td class="text"><a href="#">Text...</a>
</td>
</tr>
<tr bgcolor="#FBFBFB"><td bgcolor="#FBFBFB"><b>Författare</b>: Dan Brown</td></tr>
<tr bgcolor="#FBFBFB"><td bgcolor="#FBFBFB"><b>Utgiven</b>: 2004</td></tr>
<tr><td class="tabellUnder"></td></tr>
</table>

...

table#tabell{
font-family:  Verdana, Helvetica, Arial;
font-size: 11px;
color: black;
text-decoration: none;
border-collapse:collapse;
}
/* Färg, ljusgrått = #FBFBFB */
table#tabell td{
position: relative;
padding: 10px;
}

table#tabell td.text{
position: relative;
width: 580px;

}

table#tabell td.text a{
color: black;
text-decoration: none;
}

table#tabell td.text a:hover{
text-decoration: underline;
}

/*Tomma raden */
table#tabell td.tabellUnder{
background-color: #dddddd;
height: 1px;
overflow:hidden;
}

Jag trodde overflow hade med scrollern att göra?

Du har padding:10px; på alla td:s, sätt padding:0; i tabellUnder så blir den td:n en pixel hög.

Sen förstår jag inte varför du har position:relative i tabellen...

Lägg till en

padding:0;

för table#tabell td.tabellUnder så verkar det fixa sig i Mozilla

Förresten - du saknar en "colspan="2" på td.tabellUnder - men det visste du väl redan

Jag trodde overflow hade med scrollern att göra?

Yep - det har den...
overflow:hidden betyder att webläsaren aldrig skall visa någon scroll för det element som får den CSS-egenskapen... Det funkar bl.a. på div, td, m.fl förutom html och body...

I det här fallet sätter jag höjden till en pixel och säger åt "td:n" att den skall ignorera allt som hamnar nedanför den första pixeln istället för att (som den gör som default) sträcka ut sig nedåt så att allt får plats...

Det funkade perfekt

hihi - det är lättare när man har tillgång till hela koden så att man kan testa sig fram istället för att gissa

Hursomhelt - kul att det löste sig