[css]Table border shadow

Pagina: 1
Acties:
  • 106 views sinds 30-01-2008
  • Reageer

  • Woy
  • Registratie: April 2000
  • Niet online

Woy

Moderator Devschuur®
Topicstarter
Ik heb een table die als volgt in de html staat

HTML:
1
2
3
<table width="100%" class="myTable" border="1">
    ......
</table>

Hierbij is de border op 1 gezet omdat de pagina anders niet goed gerenderd wordt op een treo 600( Eigenlijk is er geen border nodig maar anders worden 2 cellen niet naast elkaar maar onder elkaar gerenderd ).

Nu wil ik eigenlijk de border onzichtbaar maken. Ik heb dit opgelost door de bordercolor te zetten op dezelfde kleur als de achtergrond. Als ik dit gewoon in de html doe is er geen probleem.
Nu wil ik dit eigenlijk in een stylesheet doen zodat het makkelijker is om de pagina aan te passen. Het probleem is dat als ik in de html de border op 1 zet en geen bordercolor aangeef dat hij automatisch de border 3d maakt met een donkerder en lichter kleurtje. Ik kan de kleur in mijn stylesheet wel zetten maar de schaduw blijft. mijn stylesheet ziet er als volgt uit
Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
body
{
    background-color: kleur
}
.myTable
{
    border-style:none;
    border-color:kleur;
    border-width:0px;
}

Ik heb ook geprobeerd om border-style op solid te zetten maar dit maakt geen verschil.
Is het wel mogelijk om deze schaduw weg te krijgen met een stylesheet?

[ Voor 3% gewijzigd door Woy op 13-08-2004 12:55 ]

“Build a man a fire, and he'll be warm for a day. Set a man on fire, and he'll be warm for the rest of his life.”


Verwijderd

code:
1
2
3
table {
   border: 0;
}

:)

[ Voor 19% gewijzigd door Verwijderd op 13-08-2004 12:58 ]


  • André
  • Registratie: Maart 2002
  • Laatst online: 18-05 16:30

André

Analytics dude

Zonder of met borders heeft geen bal te maken met het feit of 2 cellen onder- of naast elkaar gerenderd worden, dus zet gewoon die border op "0". Het probleem ligt ergens anders, iig niet bij die border.

  • Woy
  • Registratie: April 2000
  • Niet online

Woy

Moderator Devschuur®
Topicstarter
Bedoel je gewoon in de css?
Dat heb ik even geprobeerd maar het werkt niet

“Build a man a fire, and he'll be warm for a day. Set a man on fire, and he'll be warm for the rest of his life.”


  • Woy
  • Registratie: April 2000
  • Niet online

Woy

Moderator Devschuur®
Topicstarter
André schreef op 13 augustus 2004 @ 12:59:
Zonder of met borders heeft geen bal te maken met het feit of 2 cellen onder- of naast elkaar gerenderd worden, dus zet gewoon die border op "0". Het probleem ligt ergens anders, iig niet bij die border.
Dat zou je inderdaad denken. Maar als ik exact dezelfde html met border op 0 doe komen die 2 cellen onder elkaar.
Het is een heel vreemd bugje, maar ik kom er echt niet anders omheen.

“Build a man a fire, and he'll be warm for a day. Set a man on fire, and he'll be warm for the rest of his life.”


Verwijderd

rwb schreef op 13 augustus 2004 @ 13:03:
[...]

Dat zou je inderdaad denken. Maar als ik exact dezelfde html met border op 0 doe komen die 2 cellen onder elkaar.
Het is een heel vreemd bugje, maar ik kom er echt niet anders omheen.
Daar geloof ik echt helemaal niks van. Browsers kunnen al een jaar of 10 prima tabellen renderen, met en zonder borders.

Kun je die 2 versies van je HTML eens posten?

Verwijderd

Verwijderd schreef op 13 augustus 2004 @ 13:05:
Daar geloof ik echt helemaal niks van. Browsers kunnen al een jaar of 10 prima tabellen renderen, met en zonder borders.

Kun je die 2 versies van je HTML eens posten?
idd, zoals andré ook al zei, er zit iets anders fout in je html/css

  • Woy
  • Registratie: April 2000
  • Niet online

Woy

Moderator Devschuur®
Topicstarter
De meeste browsers kunnen dit inderdaad wel. Het is echter op een Treo600 ( een Palm )

Hieronder even twee test htm's als ik deze exact zo bekijk doet de eerste het goed en de tweede niet. Als ik in de TD's niet een geneste tabel doet werkt het ook goed. Maar mijn echte pagina is wat complexer.

Pagina 1 ( Werkt goed )
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<html>
    <head>
        <title>
            test
        </title>
    </head>
    <body>
        <table width="100%" class="myTable" border="1">
            <tr>
                <td width="50%">
                    <table>
                        <tr>
                            <th>
                                blaat blaat
                            </th>
                        </tr>
                    </table>
                </td>
                <td width="50%" valign="top">
                    <table>
                        <tr>
                            <th>Overzichten</th>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </body>
</html>

Afbeeldingslocatie: http://thuis.stroomlijn.org/got/test1.jpg
Pagina 2 ( Tekent de cellen onder elkaar )
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<html>
    <head>
        <title>
            test
        </title>
    </head>
    <body>
        <table width="100%" class="myTable">
            <tr>
                <td width="50%">
                    <table>
                        <tr>
                            <th>
                                blaat blaat
                            </th>
                        </tr>
                    </table>
                </td>
                <td width="50%" valign="top">
                    <table>
                        <tr>
                            <th>Overzichten</th>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </body>
</html>

Afbeeldingslocatie: http://thuis.stroomlijn.org/got/test2.jpg

edit:
plaatjes toegevoegd uit de emulator

[ Voor 29% gewijzigd door Woy op 13-08-2004 14:21 ]

“Build a man a fire, and he'll be warm for a day. Set a man on fire, and he'll be warm for the rest of his life.”


Verwijderd

Euh, waarom heb je geneste tabellen nodig?

* Anne heeft nog nooit zulke speciale data gezien

  • André
  • Registratie: Maart 2002
  • Laatst online: 18-05 16:30

André

Analytics dude

Ik denk dat die emulator een beetje brak is :)

En wat Anne zegt.

  • Woy
  • Registratie: April 2000
  • Niet online

Woy

Moderator Devschuur®
Topicstarter
Omdat mijn cellen links en rechts niet even groot zijn ( Het kan dus ook zo zijn dat een cel halverwege eentje aan de andere kant ophoudt. Zover ik weet kan je dan geen colspan enzo gebruiken ). Ik zou niet weten hoe ik dat anders op zou moeten lossen ( Ben niet zo super in html )

“Build a man a fire, and he'll be warm for a day. Set a man on fire, and he'll be warm for the rest of his life.”


  • Woy
  • Registratie: April 2000
  • Niet online

Woy

Moderator Devschuur®
Topicstarter
André schreef op 13 augustus 2004 @ 14:27:
Ik denk dat die emulator een beetje brak is :)

En wat Anne zegt.
Op de echte treo doet hij hetzelfde

“Build a man a fire, and he'll be warm for a day. Set a man on fire, and he'll be warm for the rest of his life.”


  • mullah
  • Registratie: April 2000
  • Laatst online: 19-07-2025
Dus die twee td's onder elkaar in de treo zijn een probleem.
Dan hou je toch border="1" er in en doe je het volgende met je stylesheet
code:
1
2
3
.myTable, .myTable td {
    border: 1px solid transparent;
}



En oh jah.. geneste tabellen.. brrrrrrrr...

[ Voor 15% gewijzigd door mullah op 13-08-2004 14:30 . Reden: andere reacties ertussen ]


Verwijderd

Omdat mijn cellen links en rechts niet even groot zijn ( Het kan dus ook zo zijn dat een cel halverwege eentje aan de andere kant ophoudt. Zover ik weet kan je dan geen colspan enzo gebruiken ). Ik zou niet weten hoe ik dat anders op zou moeten lossen ( Ben niet zo super in html )
Ah, je gebruikt dus tabellen voor presentatie? Dan is dat je probleem.

http://www.google.com/search?q=semantic+markup

  • Woy
  • Registratie: April 2000
  • Niet online

Woy

Moderator Devschuur®
Topicstarter
Door die style ook op de td te zetten werkt het inderdaad wel zoals ik wou. Ik dacht dat als je de border style van een tabel zette dat die ook meteen voor de row's en td's telde.

Maar het werkt nou ieder geval wel.

Normaal zou ik ook niet zo snel geneste tabellen gebruiken. Maar op zo'n klein apparaat moet je soms dingen uithalen die niet altijd even mooi zijn. De browser gaat namelijk altijd net even wat anders om met de html.

“Build a man a fire, and he'll be warm for a day. Set a man on fire, and he'll be warm for the rest of his life.”


Verwijderd

Ik heb het dus over helemaal geen tabellen gebruiken en simpele browsers gewoon een simpele pagina geven.

  • Woy
  • Registratie: April 2000
  • Niet online

Woy

Moderator Devschuur®
Topicstarter
Verwijderd schreef op 13 augustus 2004 @ 14:42:
Ik heb het dus over helemaal geen tabellen gebruiken en simpele browsers gewoon een simpele pagina geven.
Ga dat mijn baas maar eens vertellen ;)

“Build a man a fire, and he'll be warm for a day. Set a man on fire, and he'll be warm for the rest of his life.”


  • mullah
  • Registratie: April 2000
  • Laatst online: 19-07-2025
code:
1
<boss ordered this>...</boss ordered this>


Gokje, je baas heeft een treo en wil daar de pagina pixelperfect op zien :)

  • Woy
  • Registratie: April 2000
  • Niet online

Woy

Moderator Devschuur®
Topicstarter
zoiet ja.

Maar het is een web-applicatie speciaal voor treo's ontwikkeld, dus het moet er wel netjes uitzien.

Maar als ik die kleurtjes enzo weg kon laten was het een stuk makkelijker geweest, zeker aangezien ik niet zo thuis ben in html en css enzo. Ben meer thuis in de code die op de server draait.

“Build a man a fire, and he'll be warm for a day. Set a man on fire, and he'll be warm for the rest of his life.”

Pagina: 1