Hvor fandt jeg min skabelon?

[Kurt Hansen]

For et par år siden (cirka) fandt jeg kildekoden til en skabelon i CSS,
som jeg nu har genoptaget redigeringen af, men jeg kan ikke huske hvor
jeg fandt den. Nu vil jeg gerne læse vejledningen.

Skabelonen bruger jeg til diverse eksperimenter på
http://danacord.com/CSS-mesteren/.

En herværende bruger var begejstret og tilkendegav, at det var noget
lignende han havde ledt efter længe.

Er der nogen der kan identificere skabelonen og hvor jeg finder den på
nettet?

[Kurt Hansen]

Post by Kurt Hansen
For et par år siden (cirka) fandt jeg kildekoden til en skabelon i CSS,
som jeg nu har genoptaget redigeringen af, men jeg kan ikke huske hvor
jeg fandt den. Nu vil jeg gerne læse vejledningen.
Skabelonen bruger jeg til diverse eksperimenter på
http://danacord.com/CSS-mesteren/.
En herværende bruger var begejstret og tilkendegav, at det var noget
lignende han havde ledt efter længe.
Er der nogen der kan identificere skabelonen og hvor jeg finder den på
nettet?

Jeg fandt den:

https://www.w3schools.com/css/tryit.asp?filename=trycss_grid_layout_named

Så vidt jeg kan gennemskue, så udgør koden det overordnede layout. Det
er jo fint, men uden forklaring kan jeg jo ikke gøre andet end at
eksperimentere og se hvad der sker, når jeg ændrer noget.

Hvad gør jeg hvor hvis jeg f.eks. gerne vil sætte text-align i Footer?

Under ".grid-container > div" står der "text-align: center;". Jeg kan
godt sætte "<div class="item5" style="text-align: right";>Footer</div>",
men det er vel ikke måden at gøre det på?

[Dennis Munding]

Post by Kurt Hansen

Post by Kurt Hansen
For et par år siden (cirka) fandt jeg kildekoden til en skabelon i
CSS, som jeg nu har genoptaget redigeringen af, men jeg kan ikke
huske hvor jeg fandt den. Nu vil jeg gerne læse vejledningen.
Skabelonen bruger jeg til diverse eksperimenter på
http://danacord.com/CSS-mesteren/.
En herværende bruger var begejstret og tilkendegav, at det var
noget lignende han havde ledt efter længe.
Er der nogen der kan identificere skabelonen og hvor jeg finder den
på nettet?

https://www.w3schools.com/css/tryit.asp?filename=trycss_grid_layout_named

Post by Kurt Hansen
Så vidt jeg kan gennemskue, så udgør koden det overordnede layout.
Det er jo fint, men uden forklaring kan jeg jo ikke gøre andet end at
eksperimentere og se hvad der sker, når jeg ændrer noget.
Hvad gør jeg hvor hvis jeg f.eks. gerne vil sætte text-align i Footer?
Under ".grid-container > div" står der "text-align: center;". Jeg kan
right";>Footer</div>", men det er vel ikke måden at gøre det på?

.grid-container > div {... text-align:center; ... } centrerer teksten i
alle underliggende div's i .grid-container

Hvis din text-align skal variere i de forskellige bokse, så lav en
klasse eller et id til dem, hvori du definerer den ønskede opførsel.

Eks.:

div#top {text-align:center; ...}
div#menu {text-align: left; ...}

o.s.v.


Men personligt ville jeg slet ikke bruge omtalte skabelon, da der i
html5 netop er lavet tags, der refererer til de typiske områder på en
hjemmeside...:

nav = til menu/navigation
header = til header/top/banner (kært barn har mange navne...)
footer = til - ja, footer
main = til hovedindholdsdelen (skal dog nævnes at ikke alle browsere
forstår dette tag - kan ikke lige huske hvilke, der ikke gør.)

Og til kolonner med mindre vigtigt/sekundært indhold, kan man benytte
aside

Derudover er der også section-tagget, som er (som jeg forstår det)
beregnet til horisontal opdeling af indhold (svarende til div-tags, som
også er blokelementer).

Med html5 kan man lave en mere logisk opbygning/struktur i html'en i
forhold til tidligere.
At man gik fra tabel-opbygning til div hjalp - for mig at se - ikke
synderligt på overskueligheden i kildekoden, da mange havde/har for
vane, at opbygge siden i div, som var det en tabel.
Hvilket i mine øjne er helt hen i skoven.

[Kurt Hansen]

Post by Kurt Hansen

Post by Kurt Hansen

Post by Kurt Hansen
For et par år siden (cirka) fandt jeg kildekoden til en skabelon i
CSS, som jeg nu har genoptaget redigeringen af, men jeg kan ikke
huske hvor jeg fandt den. Nu vil jeg gerne læse vejledningen.
Skabelonen bruger jeg til diverse eksperimenter på
http://danacord.com/CSS-mesteren/.
En herværende bruger var begejstret og tilkendegav, at det var
noget lignende han havde ledt efter længe.
Er der nogen der kan identificere skabelonen og hvor jeg finder den
på nettet?

https://www.w3schools.com/css/tryit.asp?filename=trycss_grid_layout_named

Post by Kurt Hansen
Så vidt jeg kan gennemskue, så udgør koden det overordnede layout.
Det er jo fint, men uden forklaring kan jeg jo ikke gøre andet end at
eksperimentere og se hvad der sker, når jeg ændrer noget.
Hvad gør jeg hvor hvis jeg f.eks. gerne vil sætte text-align i Footer?
Under ".grid-container > div" står der "text-align: center;". Jeg kan
right";>Footer</div>", men det er vel ikke måden at gøre det på?

Tak for et grundigt svar.

Post by Kurt Hansen
Men personligt ville jeg slet ikke bruge omtalte skabelon, da der i
html5 netop er lavet tags, der refererer til de typiske områder på en

Hmmm, jeg har ikke udviklet i HTML/CSS i nogle år nu og nogen ørn har
jeg aldrig været. At starte fra scratch med HTML5 er for stor en
mundfuld for mig.

[Bertel Lund Hansen]

Post by Kurt Hansen
Hmmm, jeg har ikke udviklet i HTML/CSS i nogle år nu og nogen ørn har
jeg aldrig været. At starte fra scratch med HTML5 er for stor en
mundfuld for mig.

Nej, egentlig ikke, for det du kender i forvejen, virker
stadigvæk. I HTML får du en enkel doctype, og forenklede
erklæringer i headeren plus nogle tags der er logiske.

I gamle dage: <div class='menu'>

I HTML5: <nav>

Og sådan er det hele vejen igennem - og man behøver jo ikke lære
sig alle nye tags på én gang.

HTML 4:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Fiduso: Arkivforside 2000</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type='text/css'>
img {border:none;}
</style>
</head>

HTML5:

<!DOCTYPE html>
<html lang='da'>
<head>
<title>Fiduso: Forside</title>
<meta charset='utf-8'>
<link rel='stylesheet' href='/fiduso.css'>
</head>