/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Billeder og tekst uden tabel
Fra : Preben Nielsen


Dato : 02-07-01 12:06

Jeg har set tabeller omtalt som en gammeldags metode til at
placere tekst og billeder i forhold til hinanden. Hvilke
alternativer findes der? - Og hvad skulle fordelene være? - Og
eventuelle ulemper?

--
Brug Validator service: http://www.html.dk/validator
- Tast din URL én gang, og validér dokumentet hos 12 validatorer
- Understøtter HTML, CSS og søgemaskineoptimering

 
 
Jonas Astrup - html.~ (02-07-2001)
Kommentar
Fra : Jonas Astrup - html.~


Dato : 02-07-01 17:13

Preben Nielsen wrote in dk.edb.internet.webdesign.html:
> Jeg har set tabeller omtalt som en gammeldags metode
> til at placere tekst og billeder i forhold til hinanden.

Nemlig - et godt HTML (eller XHTML) dokument indeholder kun struktur
- ikke layout.

> Hvilke alternativer findes der?

CSS - Cascading Style Sheets
http://www.html.dk/tutorials/css/

> Og hvad skulle fordelene være?

Mere præcis og avanceret styring af layout. Mulighed for central
styring af layout på uendeligt mange HTML dokumenter. Mere
tilgængelige webløsninger. Mulighed for at lave forskellige
versioner af den samme HTML dokument - f.eks. til print, pda, etc.
Adskillelse af struktur og layout giver nemmere opdatering og
mulighed for at håndtere data mere rationelt.

> Og eventuelle ulemper?

Ikke nogen jeg kender til. Det er klart at den gamle netscape
understøtter ikke alle mulighederne - men man kan sagtens lave
løsningerne så de er læsbare i alle browsere.

IE, Opera, Netscape 6, Konqueror, Mozilla, m.fl. har en (næsten)
100% perfekt understøttelse af CSS.

Mvh
Jonas

--
Brug Validator service: http://www.html.dk/validator
- Tast din URL én gang, og validér dokumentet hos 12 validatorer
- Understøtter HTML, CSS og søgemaskineoptimering

Preben Nielsen (03-07-2001)
Kommentar
Fra : Preben Nielsen


Dato : 03-07-01 08:55

> > Hvilke alternativer findes der?
>
> CSS - Cascading Style Sheets
> http://www.html.dk/tutorials/css/
>
> > Og hvad skulle fordelene være?
>
> Mere præcis og avanceret styring af layout. Mulighed for central
> styring af layout på uendeligt mange HTML dokumenter.

Jeg er i fuld gang med at "konvertere" mit websted, så jeg nu bruger
CSS netop for at kunne styre layout på mange HTML dokumenter centralt.
Det er meget fint.
Men jeg kan ikke se hvordan jeg v.h.a CSS kan komme udenom tabeller i
forbindelse med arrangering af billeder og tekst.
Jeg modtager gerne en ide om hvad jeg kan gøre. Opgaven kan principielt
opstilles sådan (jeg taler i det følgende i mangel af bedre
"tabel-sprog"):

Tekst og billeder skal arrangeres i det der svarer til to kolonner,
hvor venstre kolonne indeholder en celle, hvori der kun er tekst.
I højre kolonne er der tre celler, den øverste indeholder et billede
(hvis bredde afgør højre kolonnes bredde (de to kolonner er ikke lige
bredde), celle nr. 2 fra oven er der en tekst til billedet, og celle
nr. 3 indeholder et andet billede.
Hvordan kan jeg lave dette arrangement uden tabel??
Der er mange sider med tekst og billeder arrangeret på denne måde. Men
antallet af billeder, kolonnernes bredde, cellernes højde vil på de
forskellige sider være forskellige afhængige af indholdet, især
billedernes størrelse og antal. Så her skal "styles" individuelt fra
side til side.
Jeg har i det jeg har læst om CSS (herunder din turorial) ikke fundet
noget svar på denne opgave.

Preben

--
Brug Validator service: http://www.html.dk/validator
- Tast din URL én gang, og validér dokumentet hos 12 validatorer
- Understøtter HTML, CSS og søgemaskineoptimering

Allan Vebel (03-07-2001)
Kommentar
Fra : Allan Vebel


Dato : 03-07-01 11:13

Preben Nielsen <visto@get2net.dk> skrev

> Jeg er i fuld gang med at "konvertere" mit websted...
> Jeg modtager gerne en ide om hvad jeg kan gøre.

Må vi ikke se din eksisterende side - så er det lidt nemmere at komme med
råd om hvordan du bedst styrer det?

--
Allan





Preben Nielsen (03-07-2001)
Kommentar
Fra : Preben Nielsen


Dato : 03-07-01 14:17

> Må vi ikke se din eksisterende side - så er det lidt nemmere at komme med
> råd om hvordan du bedst styrer det?
>
En forenklet version af den rigtige kode (kan sammenholdes med beskrivelsen
i mit oprindelige spørgsmål):

<table>
<tr>
<td rowspan="3" valign="top">Tekst tekst osv </td>
<td width="382" height="244" valign="top"><img src="billede_1.jpg"
width="382" height="244"></td>
</tr>
<tr>
<td valign="top">Her er billedteksten</td>
</tr>
<tr>
<td valign="top">
<p align="center"><img src="billede_2.jpg" width="296"
height="372"></td>
</tr>
</table>

CSS:

table   {
width:100%; table-layout: fixed;
}
td   {
vertical-align: top
}

Et problem er, at billedeksten ligger et godt stykke under billede_1, til
trods for at jeg har sat cellehøjden til samme højde som billedet. (Der er
relativt meget tekst, der hvor der står "Tekst tekst osv".)
Jeg ville være glad, hvis det virkelig kunne lade sig gøre at arbejde på en
anden måde end med tabeller. Men kan det lade sig gøre, når man vil have
tekst og billeder stående som i mit eksempel?

Preben



--
Brug Validator service: http://www.html.dk/validator
- Tast din URL én gang, og validér dokumentet hos 12 validatorer
- Understøtter HTML, CSS og søgemaskineoptimering

Jørn Andersen (03-07-2001)
Kommentar
Fra : Jørn Andersen


Dato : 03-07-01 21:11

On Tue, 3 Jul 2001 13:16:41 +0000 (UTC), Preben Nielsen
<visto@get2ne.dk> wrote:

<SNIP>
><table>
<SNIP>

>Et problem er, at billedeksten ligger et godt stykke under billede_1, til
>trods for at jeg har sat cellehøjden til samme højde som billedet. (Der er
>relativt meget tekst, der hvor der står "Tekst tekst osv".)

<TABLE CELLSPACING="0" CELLPADDING="0">
- vil hjælpe noget. Og hvis du så sætter nogle 'STYLE="margin:0;"' på
passende steder, kan du sikkert fange resten.

>Jeg ville være glad, hvis det virkelig kunne lade sig gøre at arbejde på en
>anden måde end med tabeller. Men kan det lade sig gøre, når man vil have
>tekst og billeder stående som i mit eksempel?

Det kan det sikkert (jeg er ikke ekspert i CSS-positionering) - men du
kan i første omgang forsimple din tabel til to tabelceller:

<TABLE CELLSPACING="0" CELLPADDING="0">
<tr>
<td valign="top"><p>Tekst tekst osv</p></td>

<td valign="top"><img src="billede_1.jpg" width="382" height="244"
align="bottom">
<p>Her er billedteksten</p>
<div align="center"><img src="billede_2.jpg" width="296"
height="372"></div></td>
</tr>
</table>

- det gør det da lidt simplere :)


--
Jørn Andersen
Brønshøj

Preben Nielsen (04-07-2001)
Kommentar
Fra : Preben Nielsen


Dato : 04-07-01 15:46

> >Jeg ville være glad, hvis det virkelig kunne lade sig gøre at arbejde på
en
> >anden måde end med tabeller. Men kan det lade sig gøre, når man vil have
> >tekst og billeder stående som i mit eksempel?
>
> Det kan det sikkert (jeg er ikke ekspert i CSS-positionering) - men du
> kan i første omgang forsimple din tabel til to tabelceller:
>
> <TABLE CELLSPACING="0" CELLPADDING="0">
> <tr>
> <td valign="top"><p>Tekst tekst osv</p></td>
>
> <td valign="top"><img src="billede_1.jpg" width="382" height="244"
> align="bottom">
> <p>Her er billedteksten</p>
> <div align="center"><img src="billede_2.jpg" width="296"
> height="372"></div></td>
> </tr>
> </table>
>
> - det gør det da lidt simplere :)
>
Tak for dit input. Jeg prøver nu nok Jonas' helt alternative metode (se hans
indlæg herunder) af, før jeg evt ser på din ide - jeg er lidt træt af
tabeller

--
Brug Validator service: http://www.html.dk/validator
- Tast din URL én gang, og validér dokumentet hos 12 validatorer
- Understøtter HTML, CSS og søgemaskineoptimering

Jonas Astrup - html.~ (03-07-2001)
Kommentar
Fra : Jonas Astrup - html.~


Dato : 03-07-01 16:03

Preben Nielsen wrote in dk.edb.internet.webdesign.html:
> Men jeg kan ikke se hvordan jeg v.h.a CSS kan komme
> udenom tabeller i forbindelse med arrangering
> af billeder og tekst.

Her er "værktøjerne":

1) Floats
Med floats kan du få elementer til at "flyde" til højre eller venstre -
dette kan f.eks. bruges til at lave kolonner - eller få billeder til at
flyde ind i tekst. Prøv at kigge lidt mere her:

http://www.w3.org/TR/REC-CSS2/visuren.html#floats
http://www.html.dk/tutorials/css/lektion13.asp
http://www.html.dk/artikler/00006/eksempel_6.asp?show=style

2) Positionering (relativ eller absolut)
Positionering anvendes til at placere elementer i et koordinatsystem -
enten udfra skærmens øverste venstre hjørne (absolut positionering) -
eller udfra den position elementet har i udgangspunktet (relativ
positionering).
Prøv at kigge lidt mere her:

http://www.w3.org/TR/REC-CSS2/visuren.html#positioning-scheme
http://www.html.dk/tutorials/css/lektion14.asp
http://www.html.dk/artikler/00006/eksempel_5.asp?show=style

3) Boksmodellen
(Næsten) ethvert element kan beskrives med boksmodellen i CSS. Det vil
sige at du kan justere padding, margin og border for elementer.
Prøv at læse mere her:

http://www.w3.org/TR/REC-CSS2/visuren.html#box-gen
http://www.html.dk/tutorials/css/lektion9.asp

Husk at du kan bruge <div> til at lave bokse - det er ofte en stor fordel
fremfor at definere direkte på de enkelte elementer.


Det er disse 3 værktøjer du skal bruge til at erstatte dine tabeller. Det
betyder blandt andet, at du måske skal tænke anderledes. Istedet for
rækker og kolonner, kan du med CSS positionere dine elementer istedet.
Derfor findes der altså ikke nogen direkte erstatning for <table>, <tr>
og <td> m.fl. - værktøjerne og mulighederne er anderledes og meget mere
avancerede.

Håber det hjalp dig lidt på vej?

Mvh
Jonas

--
Brug Validator service: http://www.html.dk/validator
- Tast din URL én gang, og validér dokumentet hos 12 validatorer
- Understøtter HTML, CSS og søgemaskineoptimering

Svinth (03-07-2001)
Kommentar
Fra : Svinth


Dato : 03-07-01 17:42

Jonas Astrup - html.dk <jonas.usenet@html.dk> skrev:

>Her er "værktøjerne":

[Klip: forklaring af værktøjer]

Jeg kan da lige indskyde at jeg for ca. 3 uger siden stødte på noget
om css og har nu lavet min side helt om bl.a. ved at bruge nævnte
værktøjer.

Det tager noget tid (Især når man skal lære css samtidig), men nu da
jeg har lavet det er jeg utrolig glad for det. Det er meget nemmere at
holde den samme struktur gennem sin hjemmeside, da den er bestemt på
forhånd fra en enkelt fil. Jeg håber blot at jeg udnytter
mulighederne optimalt.

Et andet værktøj jeg har benyttet mig meget af er class og id. Har
ikke fundet ud af hvad forskellen er selvom jeg har læst flere
forklaringer i denne gruppe. Jeg synes de gør det samme.


--
Tage Nielsen
Jeg er ny på usenet, så det vil blive værdsat meget at blive
vejledt, når jeg laver noget der ikke er hensigsmæssigt.
Tag hensyn til både ikke-rygere og rygere!

Jørn Andersen (03-07-2001)
Kommentar
Fra : Jørn Andersen


Dato : 03-07-01 20:51

On Tue, 03 Jul 2001 16:41:42 GMT, tsn@tanke.dk (Svinth) wrote:

<SNIP>
>Et andet værktøj jeg har benyttet mig meget af er class og id. Har
>ikke fundet ud af hvad forskellen er selvom jeg har læst flere
>forklaringer i denne gruppe. Jeg synes de gør det samme.

'id' bruges til *unikke* forekomster af et eller andet element,
mens 'class' bruges til en klasse af elementer med samme
egenskaber.

Hvis du bruger class, kan du fx skrive:
<P class="main">bla bla</P>
<P class="main">mere bla</P>
<P class="main">endnu mere bla</P>

Men hvis du bruger id - fx:
<P id="main">bla bla</P>

kan du ikke næste gang skrive:
<P id="main">mere bla</P>

fordi id'et "main" allerede er brugt en gang.

Håber det gav mening :)


Mvh. Jørn


--
Jørn Andersen
Brønshøj

Svinth (03-07-2001)
Kommentar
Fra : Svinth


Dato : 03-07-01 21:50

Jørn Andersen <jorn.a@email.dk> skrev:

[klip]

>Men hvis du bruger id - fx:
><P id="main">bla bla</P>
>
>kan du ikke næste gang skrive:
><P id="main">mere bla</P>
>
>fordi id'et "main" allerede er brugt en gang.
>
>Håber det gav mening :)

Jeg er åbenbart en dør, for det gjorde det ikke. Hvis jeg forstår det
rigtigt det du skriver kan jeg ikke i samme html-dokument skrive:

<input type="submit" id="submit" value="Send">
<input type="reset" id="submit" value="Fortryd">

Men dette er kopieret fra en af mine sider og det virker som det skal.

Jeg har brugt id og class lidt i flæng (Dog mest class) og det virker
fint hjemme ved mig. (Nu har jeg også kun en måneds erfaring indenfor
dette sprog, og det hjælper nok heller ikke at jeg koder det hele i
Note-Pad).

Jeg har faktisk lige oploadet min side med det nye design i dag, så
jeg tror da selv på at jeg er færdig med designet.


--
Tage Nielsen
Jeg er ny på usenet, så det vil blive værdsat meget at blive
vejledt, når jeg laver noget der ikke er hensigsmæssigt.
Tag hensyn til både ikke-rygere og rygere!

Jørn Andersen (03-07-2001)
Kommentar
Fra : Jørn Andersen


Dato : 03-07-01 22:56

On Tue, 03 Jul 2001 20:50:28 GMT, tsn@tanke.dk (Svinth) wrote:

Hej Svinth,

>Jeg er åbenbart en dør, for det gjorde det ikke. Hvis jeg forstår det
>rigtigt det du skriver kan jeg ikke i samme html-dokument skrive:
>
><input type="submit" id="submit" value="Send">
><input type="reset" id="submit" value="Fortryd">

Det er rigtigt forstået, så du er ikke en dør (bare så du ikke får
identitetsproblemer :)

>Men dette er kopieret fra en af mine sider og det virker som det skal.

Det er så noget helt andet. Der er mange ting, der "virker", selv om
det ikke er rigtigt - desværre, vil nogen sige.

Men når du siger, at "det virker", hvad mener du så:
a) at du har afprøvet det i MS Internet Explorer version x.yz til
Windows?
b) at du har afprøvet det i nyeste version af MSIE og Netscape til
Windows?
c) at du har afprøvet det i de 5-6 mest brugte browsere på markedet?
d) at du har afprøvet det i alle eksisterende browsere/user agents på
alle eksisterende platforme og med alle mulige brugerindstillinger?

a) eller b) er nok mest sandsynligt.
c) er der nogle få, der gør
d) er umuligt

- og det er grunden til, at man har standarder: Hvis man overholder
standarden (og hvis browser-fabrikanterne også gjorde det), så behøver
man kun lige at checke hurtigt i 1-2 browsere for at se, om det ser
nogenlunde ud.

Du må absolut ikke forstå dette som et forsøg på "mobning" af dig -
det er blot for at forklare, at det at afprøve i 1-2 browsere ikke er
nogen garanti for at brugeren ser noget fornuftigt.
Og det gælder specielt, hvis brugeren tilhører en "minoritets-gruppe"
- måske bruger man noget andet end Windows, måske er man handicappet,
msåke har man andre grunde til at bruge en ikke så udbredt browser.

Derfor synes jeg, man bør gøre sig selv den tjeneste at validere sine
sider og overholde standarderne - og i det mindste nøjes med at
overtræde dem, når man har en bestemt grund til at gøre det.

>Jeg har brugt id og class lidt i flæng (Dog mest class) og det virker
>fint hjemme ved mig. (Nu har jeg også kun en måneds erfaring indenfor
>dette sprog

Jeg bruger class mindst 100 gange så tit som jeg bruger id - det er
meget sjældent, at der er nogen fornuftig grund til at bruge id.

> og det hjælper nok heller ikke at jeg koder det hele i
>Note-Pad).

Det gør ingen forskel - det er blot besværligt :)

>Jeg har faktisk lige oploadet min side med det nye design i dag, så
>jeg tror da selv på at jeg er færdig med designet.

Prøv at checke den hos:
URL: http://validator.w3.org/>

Good luck,
Jørn


--
Jørn Andersen
Brønshøj

Svinth (04-07-2001)
Kommentar
Fra : Svinth


Dato : 04-07-01 00:29

Jørn Andersen <jorn.a@email.dk> skrev:

>Det er rigtigt forstået, så du er ikke en dør (bare så du ikke får
>identitetsproblemer :)

Det var da rart at få klarlagt.

>Du må absolut ikke forstå dette som et forsøg på "mobning" af dig -
>det er blot for at forklare, at det at afprøve i 1-2 browsere ikke er
>nogen garanti for at brugeren ser noget fornuftigt.

Jeg har bemærket at der er flere browsere, men jeg har dog kun testet
den i min egen (IE5,5). Grunden er at det er en side der kun er lavet
for min egen skyld og folk jeg kender. For min egen skyld menes der
bl. a. at jeg prøver at lære at lave en hjemmeside.

Da jeg gerne vil lære at lave en god hjemmeside det vil bl. a. sige en
side der kan ses af de fleste er det fint du fortæller lidt om
standarder og browsere mv.. Jeg er bare ikke helt kommet dertil endnu,
men tror faktisk jeg vil prøve at lege lidt med det. Det er da
åbenbart noget af en kunst at gøre sin hjemmeside tilgængelig for så
mange som muligt. Det er jo en udfordring og dem har jeg desværre
svært ved bare at lade ligge.

>Derfor synes jeg, man bør gøre sig selv den tjeneste at validere sine
>sider og overholde standarderne - og i det mindste nøjes med at
>overtræde dem, når man har en bestemt grund til at gøre det.

Jeg har prøvet at validere mine sider, men jeg må indrømme at det blev
jeg lidt forvirret over. Så vidt jeg kunne se brokkede validatoren sig
bl. a. over:
</HEAD> (Det var vist nok den sidste > den brokkede sig over.)
Det forstår jeg ikke

>Jeg bruger class mindst 100 gange så tit som jeg bruger id - det er
>meget sjældent, at der er nogen fornuftig grund til at bruge id.

Jeg bruger også class flest gange, så det var åbenbart ikke så dumt.

>> og det hjælper nok heller ikke at jeg koder det hele i
>>Note-Pad).
>
>Det gør ingen forskel - det er blot besværligt :)

Det var en skør ide jeg fik i foråret. Jeg fik den ide at jeg ville
lære html og hvis jeg brugte Note-Pad til at lave siden var jeg jo
tvungen til at lære html. Set i bakspejlet var det nok den hårde måde,
men jeg fik da lært lidt html.

>Prøv at checke den hos:
>URL: http://validator.w3.org/>

Det var en af to validatorer jeg forsøgte mig med. Den anden var vist
noget med bobby.

>Good luck,

Tak

--
Tage Nielsen
Jeg er ny på usenet, så det vil blive værdsat meget at blive
vejledt, når jeg laver noget der ikke er hensigsmæssigt.
Tag hensyn til både ikke-rygere og rygere!

Stefan Bruhn (04-07-2001)
Kommentar
Fra : Stefan Bruhn


Dato : 04-07-01 14:26

On Tue, 03 Jul 2001 23:28:40 GMT, tsn@tanke.dk (Svinth) wrote:

>Jeg har prøvet at validere mine sider, men jeg må indrømme at det blev
>jeg lidt forvirret over. Så vidt jeg kunne se brokkede validatoren sig
>bl. a. over:
></HEAD> (Det var vist nok den sidste > den brokkede sig over.)
>Det forstår jeg ikke

Validatorne kan godt være lidt kryptiske i deres fejl en gang i mellem.
Har du en URL til din side, så kan jeg prøve at se om jeg kan finde
fejlen.

--
Mvh. Stefan
Website: http://www.3x7.dk/ | http://ghashul.dk/
"I demand the right to keep and arm bears"
"A computer without Windows, is like a fish without a bicycle"

Svinth (04-07-2001)
Kommentar
Fra : Svinth


Dato : 04-07-01 15:34

Stefan Bruhn <news003@3x7.dk> skrev:

>Validatorne kan godt være lidt kryptiske i deres fejl en gang i mellem.
>Har du en URL til din side, så kan jeg prøve at se om jeg kan finde
>fejlen.

Jeg prøvede at kigge lidt nærmere på resaultatet af valideringen.
ca. 50 ud af 54 fejl starter med "Error: end tag" eller "Error: start
tag" og det vist endda kun på forsiden.

Jeg må være vildt dårlig til at sætte mine tag´s.

Her er så en URL til min hjemmeside:

<http://hjem.get2net.dk/svinth/>

Jeg prøvede også lige at se min hjemmeside med NN 4,08.

Det blev jeg i første omgang halvdårlig over, men så vidt jeg kan se
er det mest nogle ting jeg har defineret i mit style sheet.
Understøtter NN 4,x ikke css?


--
Tage Nielsen
Jeg er ny på usenet, så det vil blive værdsat meget at blive
vejledt, når jeg laver noget der ikke er hensigsmæssigt.
Tag hensyn til både ikke-rygere og rygere!

Stefan Bruhn (04-07-2001)
Kommentar
Fra : Stefan Bruhn


Dato : 04-07-01 15:46

On Wed, 04 Jul 2001 14:33:55 GMT, tsn@tanke.dk (Svinth) wrote:

Ok, du skal flytte de <script> tags der står lige efter <body> op i
<head></head> sektionen.

>Her er så en URL til min hjemmeside:
>
><http://hjem.get2net.dk/svinth/>
>
>Jeg prøvede også lige at se min hjemmeside med NN 4,08.
>
>Det blev jeg i første omgang halvdårlig over, men så vidt jeg kan se
>er det mest nogle ting jeg har defineret i mit style sheet.
>Understøtter NN 4,x ikke css?

NN 4x er meget dårlig til CSS så vidt jeg har forstået.

--
Mvh. Stefan
Website: http://www.3x7.dk/ | http://ghashul.dk/
"I demand the right to keep and arm bears"
"A computer without Windows, is like a fish without a bicycle"

Svinth (04-07-2001)
Kommentar
Fra : Svinth


Dato : 04-07-01 16:02

Stefan Bruhn <news003@3x7.dk> skrev:


>NN 4x er meget dårlig til CSS så vidt jeg har forstået.

Den eneste grund til at jeg testede i NN4x var at jeg på noget
statistik kunne se at der havde været en inde på min side med sådan en
browser og så kunne det jo være sjovt at se hvad vedkommende fik ud af
det..

Siden fungerer fint i NN4.08 men den ser bare meget grim ud.


--
Tage Nielsen
Jeg er ny på usenet, så det vil blive værdsat meget at blive
vejledt, når jeg laver noget der ikke er hensigsmæssigt.
Tag hensyn til både ikke-rygere og rygere!

Jørn Andersen (04-07-2001)
Kommentar
Fra : Jørn Andersen


Dato : 04-07-01 16:54

On Wed, 04 Jul 2001 14:33:55 GMT, tsn@tanke.dk (Svinth) wrote:

Hej,

>Jeg prøvede at kigge lidt nærmere på resaultatet af valideringen.
>ca. 50 ud af 54 fejl starter med "Error: end tag" eller "Error: start
>tag" og det vist endda kun på forsiden.
>
>Jeg må være vildt dårlig til at sætte mine tag´s.

><http://hjem.get2net.dk/svinth/>

Først en lille trøst:
En enkelt fejl i din kode kan sagtens generere en mængde følgefejl.

Dernæst:
Det der går galt for mange, er dels, at man får rodet rundt i hvad der
er block tags og hvad der er inline tags, dels at man får lavet
"krydsede tags":

(Herunder et klip fra en tidligere besvarelse, som handlede om,
hvorfor CSS ikke kunne finde ud af det.)

-------
Noget, der typisk går galt, er hvis HTML'en ikke klart skelner
"block"-elementer fra "inline"-elemneter. Så kan CSS'en ikke finde ud
af, hvad den skal "knytte sig til".

"Block"-elementer er tags som P, H1, TABLE, TR, TD, DIV etc.
"Inline"-elementer er tags som EM, STRONG, SPAN, BR

- og her er det vigtigt, at
** inline-elementer skal være i blok-elementer, aldrig omvendt
(altså:
<P><EM>blabla</EM></P> er ok
<EM><P>blabla</P></EM> er *ikke* ok)

** inline-elementer skal afsluttes inden for samme blok-element
(altså:
<P><EM>blabla</P></EM> er *ikke* ok
<P><EM>blabla</P><P>mere bla</EM></P> er *ikke* ok
<P><EM>blabla</EM></P><P><EM>mere bla</EM></P> *er* ok)

Der er flere tilfælde af samme skuffe, fx hvis man har nestede
elementer:
<P><EM>blabla og <STRONG>mere blabla</STRONG></EM></P> er ok
<P><EM>blabla og <STRONG>mere blabla</EM></STRONG></P> er *ikke* ok

-------

Konkret har du et problem omkring en tabel (linie 38-44):

38: <table id="tabletop" cellpadding="0" cellspacing="0">
39: <script type="text/javascript" src="style/menu.js"></script>
40: <noscript>
41: <p>Denne menu kræver at du har slået javascript til i din browser.
42: Slå javascript til, eller brug min menu på forsiden</p>
43: </noscript>
44: </table>


TABLE må ikke direkte indeholde andet end tabel-elementer - resten
skal ind i fx TD:
<table><tr><td>
<p>Her må du skrive noget</p>
</td></tr></table>
(dette tilfælde er formentlig blot en "smutter", da dine andre
tabeller ikke har den fejl.)

(et lignende problem:
69: </tr>
70: <dir><tr>
- du må ikke have dir (eller noget andet) her)
Du har forsøgt at "blande" en listning med en tabel. Det kan man ikke,
du er nødt til at have listningen inde i en tabelcelle.

Nogle "krydsninger:
48: <div class="body">
49: </center>
- her har du krydset to tags. Byt de to linier.

71: <td width="110#"><a href="links.html"
title="Links"><li>Links:</td></a>
- her har du <td><a ..> .. </td></a>
skal være:
<td><a ..> .. </a></td>

Hvis du:
- sætter type="text/javascript" på dine scripts
- fjerner dir og li
- bytter rundt på </td></a> -> </a></td>
så er der kun småting tilbage.

Du har så selvfølgelig det problem, at din layout nu ikke ser ud som
før :)

Et par små råd:
<h4 id="skole">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Skole:</h4>
- drop de der "&nbsp;" - brug css til at rykke ind

<br><hr>
<br>
- brug css til at styre afstande i stedet for

Jeg har lagt en valideret udgave (dog uden stylesheets og billeder)
her:
<URL: http://www.marxisme.dk/test/test/svinth.htm>


Håber ikke helt, du har mistet modet :)

Good luck,
Jørn

--
Jørn Andersen
Brønshøj

Svinth (04-07-2001)
Kommentar
Fra : Svinth


Dato : 04-07-01 22:37

Jørn Andersen <jorn.a@email.dk> skrev:

[klip]

>Du har så selvfølgelig det problem, at din layout nu ikke ser ud som
>før :)

Det er ellers tæt på. Det eneste problem er at jeg ikke kan få mit
body-element til at centrere via mit stylesheet. Det forstår jeg ikke
helt for jeg kan godt få min top til det.

>Et par små råd:
><h4 id="skole">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Skole:</h4>
>- drop de der "&nbsp;" - brug css til at rykke ind

Det er en god ide, så det vil jeg gøre.

><br><hr>
><br>
>- brug css til at styre afstande i stedet for

Lyder også som en god ide, jeg skal bare lige have fundet ud af
hvordan jeg gør det.

>Jeg har lagt en valideret udgave (dog uden stylesheets og billeder)
>her:
><URL: http://www.marxisme.dk/test/test/svinth.htm>

Jeg er lidt imponeret over at du kunne lave det så hurtigt. Jeg har
hentet den ned og sammenhodt med dine gode råd, så synes jeg egentlig
ikke der er så meget der skal rettes, så det skal jeg til at i gang
med.

>Håber ikke helt, du har mistet modet :)

Der skal noget mere til. Jeg er bare glad for at der er en der gider
bruge noget tid på mig.

Nu har jeg også sat mig for at siden skal validere, bare for at se om
jeg kan få den til det.


--
Tage Nielsen
Jeg er ny på usenet, så det vil blive værdsat meget at blive
vejledt, når jeg laver noget der ikke er hensigsmæssigt.
Tag hensyn til både ikke-rygere og rygere!

Jørn Andersen (04-07-2001)
Kommentar
Fra : Jørn Andersen


Dato : 04-07-01 23:09

On Wed, 04 Jul 2001 21:36:40 GMT, tsn@tanke.dk (Svinth) wrote:

>><br><hr>
>><br>
>>- brug css til at styre afstande i stedet for
>
>Lyder også som en god ide, jeg skal bare lige have fundet ud af
>hvordan jeg gør det.

<hr style="margin-top:2em;margin-bottom:2em;">

- eller i dit stylesheet:
hr {
margin-top:2em;
margin-bottom:2em;
}

- eller du kan blot bruge:
<p>&nbsp;</p>
<hr>
<p>&nbsp;</p>

Hvis du vil have en hurtig oversigt over CSS-"værktøjer", så er her en
i Windows Help-file format (og flere andre formater:
<URL: http://www.htmlhelp.com/distribution/>
(den er godt kun til CSS1, men alligevel meget nyttig)

Der findes også en til HTML4, og jeg bruger dem meget som hurtige
"opslagsværker".


Good luck,

Jørn

--
Jørn Andersen
Brønshøj

Svinth (05-07-2001)
Kommentar
Fra : Svinth


Dato : 05-07-01 15:24

Jørn Andersen <jorn.a@email.dk> skrev:

>Hvis du vil have en hurtig oversigt over CSS-"værktøjer", så er her en
>i Windows Help-file format (og flere andre formater:
><URL: http://www.htmlhelp.com/distribution/>
>(den er godt kun til CSS1, men alligevel meget nyttig)
>
>Der findes også en til HTML4, og jeg bruger dem meget som hurtige
>"opslagsværker".

Det er ganske nyttige værktøjer. Jeg bruger allerede begge 2 en del,
så det tog ikke lang tid for mig at vænne mig til at slå op i dem.

Jeg er lidt stolt af mig selv idag fordi jeg har fået min forside til
at validere efter w3c-standarder, så nu skal jeg bare have rettet
resten af mine sider.

Hvis jeg har forstået det med valideringen rigtigt så betyder det at
jeg gør tingene korrekt og så er det ikke min skyld hvis der er nogle
der ikke kan se mine sider, men fordi browser-fabrikanterne ikke
overholder standarden. Er det korrekt forstået?

Jeg har også valideret mit stylesheet. Jeg blev nødt til at lave et
lille krumspring for at få det valideret. Jeg har ændret farven på
scroll-baren på mine sider og jeg har læst at det ikke er
w3c-standard, så jeg lagde koden ind i et stylesheet for sig, så mit
oprindelige stylesheet validerer korrekt. Er det ikke at snyde?

Jeg vil gerne være med til at udbrede w3c-standarden, men jeg har det
ikke så godt med at lægge en knap ind på min side der siger at mit
stylesheet validerer, når jeg egentlig snyder lidt.

Mange tak for hjælpen Jørn, det var ikke så slemt at få tingene
rettet, selvom det da var noget af en liste du kom med.


--
Tage Nielsen
Jeg er ny på usenet, så det vil blive værdsat meget at blive
vejledt, når jeg laver noget der ikke er hensigsmæssigt.
Tag hensyn til både ikke-rygere og rygere!

Gunnar Vestergaard (09-07-2001)
Kommentar
Fra : Gunnar Vestergaard


Dato : 09-07-01 21:17

Jørn Andersen <jorn.a@email.dk> wrote:

> Jeg bruger class mindst 100 gange så tit som jeg bruger id - det er
> meget sjældent, at der er nogen fornuftig grund til at bruge id.

Et tip: id kan bruges som fragment identifier:
<a href="#del1">Link til længere nede</a>
....
....
<p id="del1">Teksten hernede.

Det virker bare ikke i NN 4.x. Men det er der så meget der ikke gør.

--
Gunnar Vestergaard
668 - Neighbour of the Beast

Knud Gert Ellentoft (09-07-2001)
Kommentar
Fra : Knud Gert Ellentoft


Dato : 09-07-01 23:25

Mon, 9 Jul 2001 22:16:39 +0200, skrev post@gunnar-v.dk (Gunnar
Vestergaard):

>Et tip: id kan bruges som fragment identifier:

Hvad skulle forskellen være på det og alm. bogmærkelinks?

>Det virker bare ikke i NN 4.x. Men det er der så meget der ikke gør.

Bogmærker virker i Netscape 4.


med venlig hilsen
Knud
--
http://home13.inet.tele.dk/smedpark/
Bruger din udgave af Outlook Express Sv: i svar?
Så ser en stor del af gruppens brugere ikke dit svar.
Rettelse kan hentes på http://home.chello.no/bmork/oefix.exe

Gunnar Vestergaard (10-07-2001)
Kommentar
Fra : Gunnar Vestergaard


Dato : 10-07-01 12:27

Knud Gert Ellentoft <knudgert@mail.tele.dk> wrote:
> Mon, 9 Jul 2001 22:16:39 +0200, skrev post@gunnar-v.dk (Gunnar
> Vestergaard):
> >Et tip: id kan bruges som fragment identifier:
> Hvad skulle forskellen være på det og alm. bogmærkelinks?
> >Det virker bare ikke i NN 4.x. Men det er der så meget der ikke gør.
> Bogmærker virker i Netscape 4.

Pointen var at det er enklere at skrive
<p id="denne">Tekst

end
<p><a name="denne">Tekst</a>

--
Gunnar Vestergaard
668 - Neighbour of the Beast

Preben Nielsen (04-07-2001)
Kommentar
Fra : Preben Nielsen


Dato : 04-07-01 15:42

> 1) Floats
> Med floats kan du få elementer til at "flyde" til højre eller venstre -
> dette kan f.eks. bruges til at lave kolonner - eller få billeder til at
> flyde ind i tekst. Prøv at kigge lidt mere her:
>
> http://www.w3.org/TR/REC-CSS2/visuren.html#floats
> http://www.html.dk/tutorials/css/lektion13.asp
> http://www.html.dk/artikler/00006/eksempel_6.asp?show=style
>
> 2) Positionering (relativ eller absolut)
> Positionering anvendes til at placere elementer i et koordinatsystem -
> enten udfra skærmens øverste venstre hjørne (absolut positionering) -
> eller udfra den position elementet har i udgangspunktet (relativ
> positionering).
> Prøv at kigge lidt mere her:
>
> http://www.w3.org/TR/REC-CSS2/visuren.html#positioning-scheme
> http://www.html.dk/tutorials/css/lektion14.asp
> http://www.html.dk/artikler/00006/eksempel_5.asp?show=style
>
> 3) Boksmodellen
> (Næsten) ethvert element kan beskrives med boksmodellen i CSS. Det vil
> sige at du kan justere padding, margin og border for elementer.
> Prøv at læse mere her:
>
> http://www.w3.org/TR/REC-CSS2/visuren.html#box-gen
> http://www.html.dk/tutorials/css/lektion9.asp
>
> Husk at du kan bruge <div> til at lave bokse - det er ofte en stor
fordel
> fremfor at definere direkte på de enkelte elementer.
>
>
> Det er disse 3 værktøjer du skal bruge til at erstatte dine tabeller.
Det
> betyder blandt andet, at du måske skal tænke anderledes. Istedet for
> rækker og kolonner, kan du med CSS positionere dine elementer istedet.
> Derfor findes der altså ikke nogen direkte erstatning for <table>, <tr>
> og <td> m.fl. - værktøjerne og mulighederne er anderledes og meget mere
> avancerede.
>
> Håber det hjalp dig lidt på vej?
>
OK OK - det ser da klart ud som et alternativ. Og jeg vil arbejde med det,
prøve det grundigt af, når det igen bliver indendørsvejr! - Så mere
respons kan jeg desværre ikke give lige nu.

Tak for input og inspiration, Jonas!


--
Brug Validator service: http://www.html.dk/validator
- Tast din URL én gang, og validér dokumentet hos 12 validatorer
- Understøtter HTML, CSS og søgemaskineoptimering

Søg
Reklame
Statistik
Spørgsmål : 177557
Tips : 31968
Nyheder : 719565
Indlæg : 6408883
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste