Avatar billede hanxa Nybegynder
18. september 2008 - 16:30 Der er 18 kommentarer

Lige under hinanden

Hej....

Det er sikkert simpelt men jeg vil gerne ha hvis man skriver:

Tlf.: xx xx xx xx
Fax:  xx xx xx xx

At de nummere kommer til at stå under hinanden, og det skal være uden brug af <table> og &nbsp; holder heller ikke.
Avatar billede hanxa Nybegynder
18. september 2008 - 16:50 #1
Altså

<div>
Tlf.: xx xx xx xx<br />
Fax:  xx xx xx xx
</div>
Avatar billede olebole Juniormester
18. september 2008 - 17:55 #2
<ole>

Jamen, det er jo netop meningen, at den slags skal løses med en tabel. Hvorfor ikke bare bruge det element, der er beregnet til opgaven?  =)

/mvh
</bole>
Avatar billede w13 Novice
19. september 2008 - 09:48 #3
Ja, det vil klart være bedst med tables.
Avatar billede roenving Novice
19. september 2008 - 11:33 #4
-- et andet brugbart alternativ er brugen af labels:

<label style="display:block;width:35px;float:left;">Tlf: </label>xx xx xx xx<br>
<label style="display:block;width:35px;float:left;">Fax: </label>xx xx xx xx<br>

-- som det fremgår skal man dog lave 'ting' ved det, og det samme kunne laves med f.eks. et div-tag !-)
Avatar billede hanxa Nybegynder
19. september 2008 - 11:42 #5
roenving - Tak for det, vil du smide et svar.
Avatar billede roenving Novice
19. september 2008 - 11:51 #6
-- men som olebole skriver, så er det jo uligt meget nemmere at skrive det i en tabel, så bliver det ovenikøbet fuldt dynamisk, du får præcis den pæneste opstilling uanset indhold, med andre elementer skal du måske tilpasse bare du ændrer en smule på siden !-)
Avatar billede olebole Juniormester
19. september 2008 - 14:45 #7
- og så er tabellen præcis det element, W3C anbefaler til opgaven. At der så er en masse tabel-o-fober 'derude', som nærmest 'religiøst' afsværger brug af tabeller, er en helt anden ting.

De ynder at skrive artikler for hinanden og bekræfte hinanden i den fælles tilstand. Desværre er der også en masse sagesløse begyndere, som ikke ved bedre, men derimod tror, disse tabel-o-fober har fat i en pointe. Det eneste, de i virkeligheden har fat i, er en total misforståelse af W3C's rekomanationer  =)

God kodestil er at bruge det bedste element til opgaven - og dermed også det, som er beregnet til opgaven. Dårlig kodestil er at gøre det modsatte, fordi man tager ved lære af inkompetente 'artikelsmørere'  ;o)
Avatar billede olebole Juniormester
19. september 2008 - 14:48 #8
PS: Der er intet, som tyder på, tabellen skulle være på vej ud af standarderne. De vil således helt sikkert stadig være en del af XHTML 2.0 ... og formodentlig også XHTML 3.0 - og 4.0 - og 5.0 - og ...  =)
Avatar billede hanxa Nybegynder
22. september 2008 - 14:41 #9
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>TEST</title>
<style type="text/css">
.des, .tlf
{
    line-height:14px;
    font: 11px Arial, Helvetica, sans-serif;
    color:#535353;
}

.des
{
    float:left;
}
.tlf
{
    float:left; /*float:right;*/
    position:relative;
    left:10px;
}
</style>
</head>

<body>

<div class="des">
    Tlf.:<br />
    Fax:<br />
    Mobil<br />
    e-mail
</div>
             
<div class="tlf">
    xx xx xx xx<br />
    xx xx xx xx<br />
    xx xx xx xx<br />
    xxxxx@xxxx.dk
</div>
</body>
</html>
Avatar billede hanxa Nybegynder
22. september 2008 - 15:02 #10
Og jer er nok en af disse tabel-o-fober : ) men jeg råber ikke højt med det : )
Avatar billede olebole Juniormester
22. september 2008 - 17:43 #11
Det giver absolut ikke semantisk - eller anden - mening at opstille tabulære data i div. Det svarer til ikke at ville drikke vand, fordi man kan drukne i det  ;o)

Men du har formodentlig misforstået W3C i forhold til tabeller på samme måde, som du har i forhold til markup standarder. Ellers ville du nok ikke skrive XHTML 1.0 Transitional - som i bedste fald bliver tolket som HTML-sovs i alle tilgængelige og fremtidige browsere. Den XHTML flavour er ikke andet end lettere sminket HTML 3.2.

Et godt råd: Læs W3C i stedet for artikler på WWW  ;o)
Avatar billede olebole Juniormester
22. september 2008 - 17:47 #12
- hvordan skulle søgemaskiner, blindes højtlæsere o.a. ikke-browser klienter bære sig ad med at se, linjerne i dine div hænger sammen? Du lægger voldsomme hindringer i vejen for bl.a. blinde og svagtseendes tilgang til dine websider med rigtig dårlig kodestil.

Endnu et godt råd: Tal om din tabel-o-fobi. Så er der håb for 'helbredelse'  ;o)
Avatar billede hanxa Nybegynder
22. september 2008 - 18:03 #13
Griner ;-) Okay, jeg vil gøre et forsøg - især efter dine linjer om "ikke-browser klienter", blinde og svagtseende.

Tak for et godt bidrag!
Avatar billede hanxa Nybegynder
22. september 2008 - 19:09 #14
roenving, Jeg vil gerne give olebole point?


olebole, smider du ikke et svar?
Avatar billede olebole Juniormester
22. september 2008 - 21:51 #15
Jeg vil gerne dele med roenving, hvis han også smider et svar. Han gav dig trods alt, hvad du bad om  ;o)
Avatar billede olebole Juniormester
22. september 2008 - 21:57 #16
PS: Du bør helt klart undgå de store tabelhelveder, holdt på plads af hundredevis af transparente giffer, som var det eneste layoutværktøj, vi havde op gennem 90'erne. De var ikke bare et helvede at holde styr på (man lærte at sætte borders og nogle gange også baggrundsfarver på alle tabeller i designfasen), men de var også et helvede for browsere og andre klienter at håndter. Ikke mindst, da der jo ikke var logik i forholdet mellem indhold og tabeller - kun i visuel henseende.

Til gengæld bør du helt klart bruge en tabel til indhold, der skal læses som rækker, der er delt op i søjler. Det giver langt mere logik i koden  ;o)
Avatar billede olebole Juniormester
22. september 2008 - 22:02 #17
I XUL - som er et moderne, XML baseret sprog, Mozilla har udviklet til brug i Firefox - har man da også til grid-visning valgt nøjagtig samme kodestruktur som HTML's tabel:
    http://developer.mozilla.org/en/XUL/grid
Avatar billede roenving Novice
22. september 2008 - 22:41 #18
Okay, jeg har ikke noget imod at dele med ole '-)

-- og bemærkningen, jeg glemte i mit indlæg om labels, var, at det faktisk er en helt logisk tilgang i formularer, omend de skal twistes, da de jo er inline-elementer !-)
Avatar billede 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.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

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