---

Hvad er grunden til at nogle foretrækker CSS-placering frem for
TABLES ?

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

---

Jon Vibe wrote:

> Hvad er grunden til at nogle foretrækker CSS-placering frem for
> TABLES ?

Pyh, det er nærmest blevet diskuteret til hudløshed her i webdesign-
grupperne, men her kommer et lille punktopstillet resume:

1. Tabeller er til tabulære data såsom skemaer, tidsplaner,
specifikations-sammenligninger m.v. Tabeller er ikke og har aldrig
været beregnet til at layout sider.

2. CSS-baseret design muliggør adskillelse mellem *indhold* og
*præsentation*.

3. HTML er et sprog til at *strukturere* dokumenter; man definerer,
hvad der er hovedoverskrifter (<h1>), underoverskrifter (<h2> -
<h6>), brødtekstafsnit (<p>), fremhævet tekst (<em>, <strong>).

4. CSS er et "regelsæt", eller retttere, *forslag* til hvordan et
dokument skal præsenteres. Reglerne er baseret på dokumentets
struktur, og man kan have flere forskellige style sheets, alt
afhængigt af det medie, dokumentet skal præsenteres på - hvadenten
det er en almindelig monitor, en PDA, ja sågar udskrifter på papir.

Kolonne-layout er faktisk ret enkelt med CSS. Her er nogle eksempler
(diverse løsningsforslag, jeg har lavet):

   <http://www.daimi.au.dk/~zoolook/webdesign/floating2.html>
   <http://www.daimi.au.dk/~zoolook/webdesign/floating3.html>    
   <http://www.daimi.au.dk/~zoolook/webdesign/campuslaan37/>
   <http://www.daimi.au.dk/~zoolook/webdesign/aar/>

Min hjemmeside <http://www.daimi.au.dk/~zoolook/> er lavet uden brug
af tables til layout - det er ren, velstruktureret XHTML med
tilhørende CSS. Hvis jeg skulle ønske at ændre på layoutet, foregår
det ganske enkelt ved at justere på mine style sheets - der skal ikke
ændres på en eller flere obskure tabeller-i-tabeller-i-tabeller på
samtlige sider.

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/fona/

---

Hej Anders og i andre...

Jeg har et spørgsmål til nedenstående eksempler:

Anders Thorsen Holm wrote:

> Kolonne-layout er faktisk ret enkelt med CSS. Her er nogle eksempler
> (diverse løsningsforslag, jeg har lavet):
>
> <http://www.daimi.au.dk/~zoolook/webdesign/floating2.html>
> <http://www.daimi.au.dk/~zoolook/webdesign/floating3.html>
> <http://www.daimi.au.dk/~zoolook/webdesign/campuslaan37/>
> <http://www.daimi.au.dk/~zoolook/webdesign/aar/>

Det er jo ikke første gang at jeg ser adressen på floating2.html og
floating3.html blive postet her på usenet.

Derfor har jeg brugt dem som inspiration/skabelon til min nye hjemmeside.

Det går jeg ikke udfra at du har noget imod. Imidlertid har jeg det problem
at jeg har lavet nogle links ovre til venstre, hvor du skriver "Her kan der
være en menu:". Jeg har lavet nogle <a href="Kontakt.html".. osv.> men når
man klikker på linket åbnes der bare et nyt dokument i et nyt vindue.

Jeg vil selvfølgelig have at kontakt.html skal åbnes i det vindue hvor der
står "hovedindhold/Og her er så hovedindholdet osv...".

Hvordan gør jeg det?

mvh.
Martin Jørgensen

--
---------------------------------------------------------------------------
Home of Martin Jørgensen - http://www.martinjoergensen.dk

---

Martin Jørgensen wrote:

> Derfor har jeg brugt dem som inspiration/skabelon til min nye
> hjemmeside.

Helt fint - det er det, der er hensigten med dem

> Jeg har lavet nogle <a href="Kontakt.html".. osv.> men når man
> klikker på linket åbnes der bare et nyt dokument i et nyt vindue.
> Jeg vil selvfølgelig have at kontakt.html skal åbnes i det vindue
> hvor der står "hovedindhold/Og her er så hovedindholdet osv...".

Forstår jeg det sådan, at du vil have samme effekt som på din
nuværende side <http://www.martinjoergensen.dk>? Her benytter du et
frameset.

Hvis du vil have samme muligheder med "floating-siderne", kunne du
placere en iframe med et passende navn ind i hovedindholdet.

Hvis du har adgang til SSI, eller et decideret serverside-scripting
sprog som PHP eller ASP, vil jeg dog hellere anbefale dig at udnytte
det. HTML.dk har en glimrende artikel om det:

   <http://www.html.dk/artikler/00001/>

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/fona/

---

Anders Thorsen Holm wrote:
-snip-
> Forstår jeg det sådan, at du vil have samme effekt som på din
> nuværende side <http://www.martinjoergensen.dk>? Her benytter du et
> frameset.

Ja, lige nøjagtigt... Men i siger jo hele tiden at CSS er bedre end frames,
så derfor vil jeg gerne undgå frames og lave det vha. CSS...

> Hvis du vil have samme muligheder med "floating-siderne", kunne du
> placere en iframe med et passende navn ind i hovedindholdet.

Jeg tror at jeg foretrækker at prøve at få det til at virke med en iframe,
først... Jeg har en html bog hvor der står at jeg bare skal bruge noget ala:

<div id="menu">
<div id="menubody">
<ul>
<li><a href="profil.html" target="main">Profil</a></li>
</ul>
</div><!-- end #menubody -->
</div><!-- end #menu -->

Men det virker ikke og jeg har forsøgt google groups og at søge på html.dk
uden held. Jeg indsætter endvidere følgende i din (modificerede) kode:

<div id="indhold">
<div id="indholdbody">
<iframe id="main" src="profil.html">
</iframe>
</div><!-- end #indholdbody -->
</div><!-- end #indhold -->

Hvad gør jeg galt? Når jeg klikker på linket, åbnes der er helt nyt vindue
(som en slags popup), men jeg vil kun have udskiftet koden som står i
"indholdbody"... Der er vel desuden ingen browser-kompatibilitetsproblemer
med iframe?

> Hvis du har adgang til SSI, eller et decideret serverside-scripting
> sprog som PHP eller ASP, vil jeg dog hellere anbefale dig at udnytte
> det. HTML.dk har en glimrende artikel om det:
>
> <http://www.html.dk/artikler/00001/>

Ok. Jeg har vist adgang til PHP... Og måske også SSI. Men hvordan checker
man en side med SSI, når den ligger på harddisken? Under alle
omstændigheder, tror jeg at jeg lige venter lidt med disse, hvis jeg kan
undgå det. Så kan jeg lære det andet bagefter...

mvh.
Martin Jørgensen

--
---------------------------------------------------------------------------
Home of Martin Jørgensen - http://www.martinjoergensen.dk

---

On Sun, 14 Mar 2004 12:32:23 +0100, Martin Jørgensen
<unoder(spam-filter)@(remove-this)jay.net> wrote:

> Men det virker ikke og jeg har forsøgt google groups og at søge på
> html.dk
> uden held. Jeg indsætter endvidere følgende i din (modificerede) kode:
>
> <div id="indhold">
> <div id="indholdbody">
> <iframe id="main" src="profil.html">
> </iframe>
> </div><!-- end #indholdbody -->
> </div><!-- end #indhold -->

Det skal være <iframe name="main" src="profil.html">.
Altså udskift id med name, så virker det.


--
Ryan Kristensen

---

Ryan Kristensen wrote:
> On Sun, 14 Mar 2004 12:32:23 +0100, Martin Jørgensen
> <unoder(spam-filter)@(remove-this)jay.net> wrote:
-snip-

="main" src="profil.html">.
> Altså udskift id med name, så virker det.

Yes, tak for det

mvh.
Martin Jørgensen

--
---------------------------------------------------------------------------
Home of Martin Jørgensen - http://www.martinjoergensen.dk

---

"Martin Jørgensen" <unoder(spam-filter)@(remove-this)jay.net> skrev

> Ok. Men hvordan checker
> man en side med SSI, når den ligger på harddisken?

Det kræver, at du har installeret noget serversoftware. Det kan være PWS -
'Personal Web Server' eller IIS - 'Internet Information Server'. Hvilken af
dem, du vil bruge, afhænger af dit OS. PWS fulgte med Win98, men kan også
køre på WinME. IIS fulgte med WinXP Pro, man kan også køre på Win2000 og
vistnok også på WinXP PE.

Du kan læse mere om installation og konfiguration af PWS her (ISS skulle
efter sigende ikke afvige så meget, at det skulle give problemer med
forståelsen):

www.hjemmesideskolen.dk/net.pws.asp

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://html-faq.dk
http://hjem.get2net.dk/egin

---

Erik Ginnerskov wrote:
> "Martin Jørgensen" <unoder(spam-filter)@(remove-this)jay.net> skrev
-snip-
> Det kræver, at du har installeret noget serversoftware. Det kan være
> PWS - 'Personal Web Server' eller IIS - 'Internet Information
> Server'. Hvilken af dem, du vil bruge, afhænger af dit OS. PWS fulgte
> med Win98, men kan også køre på WinME. IIS fulgte med WinXP Pro, man
> kan også køre på Win2000 og vistnok også på WinXP PE.

Ok, tak for det... Det vil jeg nok kigge på, ved lejlighed.

> Du kan læse mere om installation og konfiguration af PWS her (ISS
> skulle efter sigende ikke afvige så meget, at det skulle give
> problemer med forståelsen):
>
> www.hjemmesideskolen.dk/net.pws.asp

Jeg får godtnok ellers en HTTP 404 blev ikke fundet-besked....

mvh.
Martin Jørgensen

--
---------------------------------------------------------------------------
Home of Martin Jørgensen - http://www.martinjoergensen.dk

---

On Sun, 14 Mar 2004 16:54:05 +0100, Martin Jørgensen
<unoder.spam@jay.spam.net> wrote:

> Erik Ginnerskov wrote:
>> www.hjemmesideskolen.dk/net.pws.asp
>
> Jeg får godtnok ellers en HTTP 404 blev ikke fundet-besked....

Jeg tror han mener:
http://www.hjemmesideskolen.dk/net/pws.asp

--
Ryan Kristensen

---

"Ryan Kristensen" <ryankristensen@hotmail.invalid> skrev

> >> www.hjemmesideskolen.dk/net.pws.asp
> >
> > Jeg får godtnok ellers en HTTP 404 blev ikke fundet-besked....
>
> Jeg tror han mener:
> http://www.hjemmesideskolen.dk/net/pws.asp

Rigtigt, min fejl, sorry

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://html-faq.dk
http://hjem.get2net.dk/egin

---

"Erik Ginnerskov" <egin@spam.invalid> skrev:

>Du kan læse mere om installation og konfiguration af PWS her (ISS skulle
>efter sigende ikke afvige så meget, at det skulle give problemer med
>forståelsen):
>
> www.hjemmesideskolen.dk/net.pws.asp

"Siden blev ikke fundet"

--
hilsen pl (peloda hos tiscali her i landet)
http://pedalo.dk/thailand/

---

"Peter Loumann" <me@privacy.net> skrev

> > www.hjemmesideskolen.dk/net.pws.asp
>
> "Siden blev ikke fundet"

Tre timer før dit indlæg havde Ryan Kristensen opklaret, at det midterste .
skulle have været en /

www.hjemmesideskolen.dk/net/pws.asp

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://html-faq.dk
http://hjem.get2net.dk/egin

---

"Erik Ginnerskov" <egin@spam.invalid> skrev:

>> > www.hjemmesideskolen.dk/net.pws.asp
>>
>> "Siden blev ikke fundet"
>
>Tre timer før dit indlæg havde Ryan Kristensen opklaret, at det midterste .
>skulle have været en /
>
> www.hjemmesideskolen.dk/net/pws.asp

Ja. Jeg rødmer af skam og lover fremover at læse en tråd til ende
inden jeg mener noget.

--
hilsen pl (peloda hos tiscali her i landet)
http://pedalo.dk/thailand/

---

"Martin Jørgensen" <unoder.spam@jay.spam.net> skrev

> Det er jo ikke første gang at jeg ser adressen på floating2.html og
> floating3.html blive postet her på usenet.
> Derfor har jeg brugt dem som inspiration/skabelon til min nye hjemmeside.
> Det går jeg ikke udfra at du har noget imod.

Jeg vil tro (jeg har ikke håndfast bevis), at ATH henviser til eksemplerne,
for at du skal kunne se, hvordan det kan laves. Så det er nok helt OK.

> Imidlertid har jeg det problem
> at jeg har lavet nogle links ovre til venstre, hvor du skriver "Her kan
der
> være en menu:". Jeg har lavet nogle <a href="Kontakt.html".. osv.> men når
> man klikker på linket åbnes der bare et nyt dokument i et nyt vindue.
>
> Jeg vil selvfølgelig have at kontakt.html skal åbnes i det vindue hvor der
> står "hovedindhold/Og her er så hovedindholdet osv...".

Et link til den side, der driller dig, ville gøre det meget lettere at
hjælpe dig.

http://infimum.dk/HTML/hjaelpmig.html

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://html-faq.dk
http://hjem.get2net.dk/egin

---

Hej Anders.

Anders Thorsen Holm wrote:
-snip-
> Kolonne-layout er faktisk ret enkelt med CSS. Her er nogle eksempler
> (diverse løsningsforslag, jeg har lavet):
>
> <http://www.daimi.au.dk/~zoolook/webdesign/floating2.html>
> <http://www.daimi.au.dk/~zoolook/webdesign/floating3.html>
> <http://www.daimi.au.dk/~zoolook/webdesign/campuslaan37/>
> <http://www.daimi.au.dk/~zoolook/webdesign/aar/>

Jeg bliver lige nødt til at spørge dig, hvad du mener med at "Denne div
benyttes primært til at cleare de floats, der benyttes til menu og indhold,
men kan lige så godt benyttes til information i bunden."

Hvad er det som skal "cleares"? Det forstår jeg ikke.

mvh.
Martin Jørgensen

--
---------------------------------------------------------------------------
Home of Martin Jørgensen - http://www.martinjoergensen.dk

---

Martin Jørgensen wrote:

> Jeg bliver lige nødt til at spørge dig, hvad du mener med at
> "Denne div benyttes primært til at cleare de floats, der benyttes
> til menu og indhold, men kan lige så godt benyttes til information
> i bunden."

Clear: left "ophæver" effekten af de floats, der benyttes til at
venstrestille menu og indhold. Det gør at de ikke lægger sig op på
siden af footer-diven, og den omgivende block formår at "strække
sig" omkring menu og indhold, så man kan se baggrunden.

Lidt (teknisk) information:

   <http://www.w3.org/TR/CSS2/visuren.html#propdef-clear>

Men tag det ikke tungt, hvis det forvirrer - floats og clears er
nogle, skumle størrelser, og jeg har til tider selv svært ved at
gennemskue dynamikken.

Indexet over CSS2-specifikationen er forresten et glimrende
opslagsværk:

   <http://www.w3.org/TR/CSS2/indexlist.html>

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/fona/

---

Anders Thorsen Holm wrote:

> Martin Jørgensen wrote:
-snip-
> Clear: left "ophæver" effekten af de floats, der benyttes til at
> venstrestille menu og indhold. Det gør at de ikke lægger sig op på
> siden af footer-diven, og den omgivende block formår at "strække
> sig" omkring menu og indhold, så man kan se baggrunden.

??? Det fattede jeg ikke en skid af

> Lidt (teknisk) information:
>
> <http://www.w3.org/TR/CSS2/visuren.html#propdef-clear>

Ok, det link ser spændende ud. Jeg har bookmarket det og prøver at vende
tilbage til det en anden dag.

> Men tag det ikke tungt, hvis det forvirrer - floats og clears er
> nogle, skumle størrelser, og jeg har til tider selv svært ved at
> gennemskue dynamikken.
>
> Indexet over CSS2-specifikationen er forresten et glimrende
> opslagsværk:

Ja, det har jeg fundet ud af... Tak for linket. Det skal jeg nok få brug for
senere hen...

mvh.
Martin Jørgensen

--
---------------------------------------------------------------------------
Home of Martin Jørgensen - http://www.martinjoergensen.dk

---

"Martin Jørgensen" <unoder.spam@jay.spam.net> skrev

> Jeg bliver lige nødt til at spørge dig, hvad du mener med at "Denne div
> benyttes primært til at cleare de floats, der benyttes til menu og
indhold,
> men kan lige så godt benyttes til information i bunden."
>
> Hvad er det som skal "cleares"? Det forstår jeg ikke.

Hvis du har nogle elementer indsat på en side og et efterfølgende element
skal lægges ned under det floatede (i stedet for ved siden af), skal det
cleares (defineres friholdt i forhold til det ovenstående floatede):

<div id="menu" style="float:left">Menu</div>
<div id="indhold">Sideindhold</div> <!-- lægger sig ved siden af
menuen -->
<div id="footer" style="clear:both">Slutnote</div> <!-- lægger sig under
det længste af ovenstående -->

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://html-faq.dk
http://hjem.get2net.dk/egin

---

Erik Ginnerskov wrote:

> "Martin Jørgensen" <unoder.spam@jay.spam.net> skrev
-snip-
>> Hvad er det som skal "cleares"? Det forstår jeg ikke.
>
> Hvis du har nogle elementer indsat på en side og et efterfølgende element
> skal lægges ned under det floatede (i stedet for ved siden af), skal det
> cleares (defineres friholdt i forhold til det ovenstående floatede):

Okay.... hmm... Så siger vi det

Spøg til side:

> <div id="menu" style="float:left">Menu</div>
> <div id="indhold">Sideindhold</div> <!-- lægger sig ved siden af
> menuen -->
> <div id="footer" style="clear:both">Slutnote</div> <!-- lægger sig under
> det længste af ovenstående -->

float:left betyder at menu-div'en skal lægges til venstre, men ift. hvad?

Og footer lægger sig nede under både menu og indhold. Gættede jeg rigtigt?
Den lægger sig nedenunder fordi der står clear:both. Hvad så hvis man havde
3 floats som skulle cleares og man skriver clear:both? Jeg fatter det ikke
rigtigt...

mvh.
Martin Jørgensen

--
---------------------------------------------------------------------------
Home of Martin Jørgensen - http://www.martinjoergensen.dk

---

"Martin Jørgensen" <unoder.spam@jay.spam.net> skrev

> float:left betyder at menu-div'en skal lægges til venstre, men ift. hvad?

float:left betyder, at det lægger sig i venstre side og tillader noget andet
at lægge sig til højre herfor. En <div>, der ikke har fået tildelt
float:left, vil ikke tillade noget andet tilhøjre for sig.

> Og footer lægger sig nede under både menu og indhold. Gættede jeg rigtigt?
> Den lægger sig nedenunder fordi der står clear:both. Hvad så hvis man
havde
> 3 floats som skulle cleares og man skriver clear:both? Jeg fatter det ikke
> rigtigt...

Du har tre muligheder:

clear:left (bruges, hvis du med sikkerhed ved, at det venstre af kun to
elementer ovenover *altid* er det længste)
clear:right (bruges, hvis du med sikkerhed ved, at det højre af kun to
elementer ovenover *altid* er det længste)
clear:both (bruges, hvis du er i tvivl om, hvilket af kun to elementer
ovenover, der kan tænkes at være længst i en given bredde browservindue
eller hvis der er mere end to floatede elementer ved siden af hinanden
ovenover)

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://html-faq.dk
http://hjem.get2net.dk/egin

---

Erik Ginnerskov wrote:
-snip-
> Du har tre muligheder:
>
> clear:left (bruges, hvis du med sikkerhed ved, at det venstre af kun
> to
> elementer ovenover *altid* er det længste)
> clear:right (bruges, hvis du med sikkerhed ved, at det højre af kun to
> elementer ovenover *altid* er det længste)
> clear:both (bruges, hvis du er i tvivl om, hvilket af kun to elementer
> ovenover, der kan tænkes at være længst i en given bredde browservindue
> eller hvis der er mere end to floatede elementer ved siden af hinanden
> ovenover)

Okay, mange tak for forklaringen. Jeg følger lige med i gruppen her og på et
tidspunkt tror jeg jeg lærer det...

mvh.
Martin Jørgensen

--
---------------------------------------------------------------------------
Home of Martin Jørgensen - http://www.martinjoergensen.dk

---

Jon Vibe <jon@vibedesign.dk> skrev :

>Hvad er grunden til at nogle foretrækker CSS-placering frem for
>TABLES ?

Udover Anders glimrende svar, så stammer brugen af tabeller til
design fra en tid, hvor man ikke havde css og tabeller var derfor
den eneste måde til at lave design på siderne med.

Man kan også komme frem med en hestevogn, men det går hurtigere
(og nemmere) med en bil.

Tilsvarende med css, det gør koderne mere overskuelligt, når man
har øvelsen er det hurtigere og mere overskueligt samtidig med at
ændringer er nemmere.
--
Knud