CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

mpj86 Nybegynder

21. maj 2004 - 13:48 Der er 22 kommentarer og
1 løsning

problemer med border-top?

Hej

mit problem er at den ikke vil viste border_top uden jeg skriver nået i hver td:

<tr>
<td width="89" height="1" class="border_top"></td>
<td width="248" height="1" class="border_top"></td>
<td width="101" height="1" class="border_top"></td>
<td width="78" height="1" class="border_top"></td>
<td width="69" height="1" class="border_top"></td>
</tr>

Hvordan gør jeg så den godt vil vise border_top uden jeg skal skrive nået i hver td?

border_top i min style.css ser sådan ud:

.border_top {
border-top: 1px solid #000000;
}

Synes godt om

sierradriver Nybegynder

21. maj 2004 - 13:56 #1

Der skal være indhold i cellen, men det kan let omgås ved at laver en lille såkaldt spacer.

I hver td, indsætter du bare denne: <img src="spacer.gif" width="1" height="1">

Synes godt om

roenving Novice

21. maj 2004 - 13:56 #2

Den klassiske løsning er faktisk at skrive noget 'ingenting' i alle celler:

<tr>
<td width="89" height="1" class="border_top"> </td>
<td width="248" height="1" class="border_top"> </td>
<td width="101" height="1" class="border_top"> </td>
<td width="78" height="1" class="border_top"> </td>
<td width="69" height="1" class="border_top"> </td>
</tr>

Synes godt om

roenving Novice

21. maj 2004 - 13:59 #3

Hvis dit publikum kun er Mozilla/Opera, er der også en style-property til tables, du kan bruge:

<table ... style="empty-cells:show">

Se evt. http://blooberry.com/indexdot/css/properties/table/emptycell.htm

Synes godt om

mpj86 Nybegynder

21. maj 2004 - 14:03 #4

sierradriver: Tak det virker, skriv lige som et svar..

roenving: Dit forslag virker også, bare ikke til det jeg skal bruge den til...

Synes godt om

olebole Juniormester

21. maj 2004 - 17:05 #5

<ole>

Det er langt bedre at skrive   i stedet for at bruge en spacer-gif - det performer bedre. Gør man det rigtigt, kan det sagtens bruges i dette tilfælde :)

<style type="text/css">
.border-top td {
height: 1px;
border-top: 1px solid #000000;
font-size: 0px;
line-height: 0px;
}
</style>

<tr class="border_top">
<td width="89"> </td>
<td width="248"> </td>
<td width="101"> </td>
<td width="78"> </td>
<td width="69"> </td>
</tr>

/mvh
</bole>

Synes godt om

Slettet bruger

21. maj 2004 - 17:31 #6

...eller efter finjusteringen og optimeringen af hhv. Roenving og Olebole:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
.td.border_top {
height: 1px;
border-top: 1px solid #000000;
font-size: 0px;
line-height: 0px; }
</style>
<title>Untitled</title>
</head>

<body>

<table>
<tr class="border_top">
<td width="89" class="border_top"> </td>
<td width="248" class="border_top"> </td>
<td width="101" class="border_top"> </td>
<td width="78" class="border_top"> </td>
<td width="69" class="border_top"> </td>
</tr>
</table>

</body>
</html>

Synes godt om

Slettet bruger

21. maj 2004 - 17:35 #7

...og alle tallene skal vist også lige have størrelsen "px" fastsat, for også at omfatte alle browsere, da IE vist er den eneste som bruger "px" som udgangspunkt...

Derfor:
<table>
<tr class="border_top">
<td width="89px" class="border_top"> </td>
<td width="248px" class="border_top"> </td>
<td width="101px" class="border_top"> </td>
<td width="78px" class="border_top"> </td>
<td width="69px" class="border_top"> </td>
</tr>
</table>

Eller tager jeg helt fejl?

Synes godt om

olebole Juniormester

21. maj 2004 - 17:39 #8

extend >> Det er to gange vrøvl - der er kun ganske få og små huller mellem fejlene. Nu var forslagene lige så gode - så er der ingen grund til at lave dem skrup forkerte :)

Synes godt om

Slettet bruger

21. maj 2004 - 17:44 #9

Ok, så jeg gør det bare værre? Sorry at jeg blandede mig... ;-)
Men hvor har jeg vrøvlet mest? Måske jeg også kunne lære et eller andet...?

Synes godt om

olebole Juniormester

21. maj 2004 - 20:18 #10

Husk altid URL'en i DTD'en - ellers kan IE ikke tolke CSS korrekt. F.eks:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

.td.border_top {
Her skriver du: Klassen '.border_top', som ligger unde klassen '.td'

.border-top td {
Her skriver jeg: Alle <td>'er under klassen '.border-top' - og det er jo noget helt andet.
Derfor behøver jeg heller ikke klasse-angivelser på <td>'erne - men kun på <tr>'en.

Så var jeg lidt hurtig med hensyn til 'px' på width - det kan du godt, sorry ;o)
Skulle det være helt godt, burde det have været lagt ind under en style-property på <td>'erne ... men det galdt os begge ;o)
/mvh

Synes godt om

roenving Novice

21. maj 2004 - 20:25 #11

Vedr. px på width:

-- da width-attributten er deprecated fra html 4.01 og helt fjernet fra xhtml 1.1 er det i bedste fald overflødige bytes, da den slags angivelser slet ikke havde relevans i html 3, hvor browseren (vist nok !-) under alle omstændigheder tolkede det som pixel ...

Synes godt om

olebole Juniormester

21. maj 2004 - 21:39 #12

Nuvel, men nu betyder 'deprecated' jo ikke 'forbudt' - og så er det ikke en fejl, hvis man skriver til HTML4.01 :)

Synes godt om

mpj86 Nybegynder

21. maj 2004 - 21:41 #13

Hvilken måde er så den bedste?

Synes godt om

Slettet bruger

21. maj 2004 - 21:42 #14

Aha... ja, så blev jeg alligevel en del klogere. :-)

Vedr. URL'en i DTD'en:
Ja, jeg fik ikke lige sat denne URL ind. En dum copy-and-paste fejl fra min side. >:-(

Vedr. klasse-angivelser på <tr> eller <td>'erne:
.border_top td gælder for alle klasser under den <tr>, som de er angivet i? Jeg vidste ikke at man kunne give alle <td>érne på sådan en enkel måde! Smart! :-)

Vedr. px på width:
Ja, der burde selvfølgelig have været en anden løsning end bare width.
Hvis der er samme width på hver <td>, kan man skrive det i style-propertyén.
Men hvis der er forskelige width, er denne vel den korrekte løsning? :
style="width: 89px" osv. angivet i de enkelte <td>ér?

Håber ikke at dette bliver opfattet som spam eller unødig indblanden fra nogens side?

Synes godt om

Slettet bruger

21. maj 2004 - 21:48 #15

mpj86:
Du skal klart benytte de metoder som Roenving og Olebole anbefaler. Altså via CSS.

Synes godt om

Slettet bruger

21. maj 2004 - 21:50 #16

mpj86:
Skal jeg lige renskrive eksemplet til dig?

Synes godt om

Slettet bruger

21. maj 2004 - 21:56 #17

Her er den samlede version, efter Roenving´s og Olebole´s anbefaling:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled</title>
<style type="text/css">
.border_top td {
height: 1px;
border-top: 1px solid #000000;
font-size: 0px;
line-height: 0px; }
</style>
</head>

<body>
<table border="0" cellpadding="0" cellspacing="0">
<tr class="border_top">
<td style="width: 89px;"> </td>
<td style="width: 248px;"> </td>
<td style="width: 101px;"> </td>
<td style="width: 78px;"> </td>
<td style="width: 69px;"> </td>
</tr>
</table>
</body>
</html>

Synes godt om

olebole Juniormester

21. maj 2004 - 21:58 #18

Mmmmmmm .... så smukt, at der falder dug i øjenkrogen! ;o)

Synes godt om

Slettet bruger

21. maj 2004 - 22:05 #19

olebole:
Ja ja, så er det godt med dig du. :-)

Den validerer også med både HTML 4.01 og CSS, og med en XHTML 1.0 Trans-doctype, validerer den også uden problemer. :-)

Synes godt om

mpj86 Nybegynder

22. maj 2004 - 11:04 #20

Så siger jeg tak for hjælpen...

Det må vel være olebole der skal have de 30 points..

Er det bedre at bruge denne:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

End denne?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Skal jeg også skrive: <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> i toppen af mit style.css dokumentet?

Hvorfor virkede det ikke med: .border_top { men det virker med: .border_top td { hvorfor skal der stå td?

Synes godt om

olebole Juniormester

22. maj 2004 - 11:14 #21

Det med DTD'en og klasserne forklarede jeg i (21/05-2004 20:18:22).

Nej, meta'en skal du bare have stående i head-delen af dit HTML-dokument. Ikke i CSS-filen.
/mvh

Synes godt om

mpj86 Nybegynder

22. maj 2004 - 11:28 #22

Ok takker.

Synes godt om

olebole Juniormester

22. maj 2004 - 11:54 #23

Selvtak :)

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Variabler som ikke virker Af Frits Jensen i HTML	2	30/10/202409:37	30/10/202413:04
Aldersbegrænsning på min hjemmeside Af ØLMANDEN i HTML	2	29/09/202410:58	30/09/202412:04
Bredde på div elementer Af dane022 i HTML	2	16/02/202408:29	20/02/202412:50
Hvilken mindste mobilstørrelse til hjemmeside Af CSharpRazor i HTML	2	21/12/202322:51	22/12/202308:03
validering <input tlfnr. Af slein55 i HTML	5	15/10/202311:43	15/10/202314:51

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS