[CSS] Correcte schrijfwijze

quote:

mophor schreef op vrijdag 22 juli 2005 @ 16:35:
3) ik zal je nog sterker vertellen: xhtml werkt niet eens in internet explorer, maar daar is zat over te vinden. HTML (en XHTML) horen uberhaupt geen rol te spelen in de opmaak van je pagina.

6) een bewuste volgorde is wat anders dan of die volgorde van belang is. Je moet je afvragen of de betekenis van de lijst veranderd als je de boel husselt. In mijn geval vind ik dat niet. Bij een lijstje met prijswinnaars ofzo is dat wel het geval.

3) Okee duidelijk.
4) Ik snap je punt.

Ik wil onderstaand voorbeeld realiseren in HTML:


Voor de realisatie heb ik onderstaande code geschreven:

HTML:

1	<h3><h1>29</h1> object(en) gevonden in de categorie: <h2>bestaande bouw</h2>.</h3>

Nu vraag ik mij af of mijn code semantisch correct is aangezien MSIE renderproblemen (foute lettergroottes) geeft bij het gebruik van head-tags (h1, h2 etc.) binnen head-tags?

Wellicht handiger om eens goed de specificaties door te lezen (10 minute HTML guide. Ook waar elementen voor bedoeld zijn. Als je naar jouw voorbeeld kijkt, dan ga je mij toch niet vertellen dat die drie koppen de drie belangrijkste items op je pagina zijn?

Daarnaast geeft de specificatie aan dat een header alleen inline elementen mag bevatten (en dus geen header, wat een block-element is: http://www.w3.org/TR/html4/struct/global.html#h-7.5.5).

Dat kan je ook achterhalen via de validator van w3. De validator is niet heilig, maar geeft wel genoeg informatie waarom bepaalde HTML schrijfwijze niet correct is.

Ik vind het wel grappig dat je HTML probeert aan te leren, maar verdiep je wel eerst in de manier waarop je het moet toepassen, voordat je lukraak elementen gaat gebruiken

BtM909 wijzigde dit bericht 25-07-2005 12:13 (17%)

quote:

BtM909 schreef op maandag 25 juli 2005 @ 12:12:
Wellicht handiger om eens goed de specificaties door te lezen (10 minute HTML guide. Ook waar elementen voor bedoeld zijn. Als je naar jouw voorbeeld kijkt, dan ga je mij toch niet vertellen dat die drie koppen de drie belangrijkste items op je pagina zijn?

Daarnaast geeft de specificatie aan dat een header alleen inline elementen mag bevatten (en dus geen header, wat een block-element is: http://www.w3.org/TR/html4/struct/global.html#h-7.5.5).

Dat kan je ook achterhalen via de validator van w3. De validator is niet heilig, maar geeft wel genoeg informatie waarom bepaalde HTML schrijfwijze niet correct is.

Ik vind het wel grappig dat je HTML probeert aan te leren, maar verdiep je wel eerst in de manier waarop je het moet toepassen, voordat je lukraak elementen gaat gebruiken

Okee die head-tags zijn dus fout. Echter lijkt het gebruik van p-tags mij ook niet echt logisch aangezien ik die '29' bijvoorbeeld niet snel als alinea kwalificeer. Het beste lijkt het me dan om een div te gebruiken?

deprogrammeur wijzigde dit bericht 25-07-2005 13:19 (6%)

Die '29' moet je ook niet als <p> gebruiken want het is geen paragraaf.
Je kan hiervoor best wel <span>'s voor gebruiken, dus zoiets:


HTML:

1	<span class="regeltje"><b>29</b> object(en) gevonden in de categorie: <span class="cat">bestaande bouw</span>.</span>

Maar het is wel onderdeel van de alinea, en laat een <p/> nu juist een alinea aangeven . Als je per se wil dat '29' een semantische opmaak krijgt, dan zul je moeten gaan kijken naar andere dingen dan gewoon pure HTML, zie ook Semantic web daarvoor.

Ik zou jouw zinnetje zo opmaken:
HTML:

1	<p><span class="aantal">29</span> object(en) gevonden in de categorie: <span class="categorie">bestaande bouw</span>.</p>

zou iets doen als
<p><span>29</span> object(en) gevonden in de categorie: <i>bestaande bouw</i>.</p>

met die <i> in de lijn van de gedachte van http://www.whatwg.org/specs/web-apps/current-work/#the-i

b zou ik niet gebruiken, die stelt semantisch niets voor (i in de oude definitie ook niet)

edit: in essentie wat harm dus zegt. Alleen zou ik zijn class="aantal" liever class="number" maken, om het wat algemener te houden

mophor wijzigde dit bericht 25-07-2005 13:22 (27%)

Okee ik snap het. Wederom hartelijk bedankt!

Edit:

Ik realiseer nu onderstaand voorbeeld:



Voor de 'Plaats', 'Status' etc. gebruik ik de head-tag. Volgens de W3-specs mag dat, aangezien head-elementen inline-elementen zijn. Echter vraag ik me af of het ook een juiste toepassing van de head-tag is? Ik vind het gebruik van span-tag met als class 'head' o.i.d. namelijk niet echt netjes. Kortom vinden jullie het gebruik van de head-tag binnen deze context gerechtvaardigd, of moet ik toch een span-tag gebruiken?

HTML:

1 2 3 4 5 6 7 8 9 10 11 12

<div class="structure" id="recent">     <h1>Van der Helstraat 50</h1>     <p>         [img]"../images/image_small.png"[/img]         <p>             <h1>Plaats: </h1>Leeuwarden             <h1>Status: </h1>te koop             <h1>Opp. perceel: </h1>127 m2             <h1>Vraagprijs: </h1>E 125.000,- kk         </p>     </p> </div>

deprogrammeur wijzigde dit bericht 25-07-2005 17:26 (92%)

kijk eens naar een dl

verder is h1 echt een block element hoor, die mag ook never niet in een p

verder mogen genestte p's ook niet. Misschien moet je de specs toch iets beter doorlezen, zelfs in die 10 min HTML guide die al genoemd is staat een dl genoemd overigens. Er zijn een hoop nuttige links langsgekomen, lees je die ook door?

id=recent lijkt me niet handig, ga je al die blokken aan de rechterkant recent noemen? Naast het blok links en midden is rechts volgens mij een apart "hoofdstuk" je zou daarvoor zelfs een h1 recent kunnen doen, de blokken erin zijn paragrafen erbinnen


HTML:

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<div id="recent">     <h1>recent</h1> <!-- deze geef je niet weer dmv css -->     <div>       <h2>Van der Helstraat 50</h2>       <p>[img]"../images/image_small.png"[/img]</p>       <dl>             <dt>Plaats: </dt>             <dd>Leeuwarden</dd>         </dl>     </div>     <div>       <!-- volgende huis -->     </div> </div>

edit: dit is dus voor het complete rechter deel. Als algemene tip: probeer je css zo min mogelijk van id's en classes af te laten hangen, het hele rechter deel kan je selecteren op het id=recent

die h1 heb ik erbij gezet voor de duidelijkheid, da's wellicht handig voor text- en speechbrowsers. met css laat je die gewoon niet zien als je dat niet wilt: #recent h1 {display: none}

mophor wijzigde dit bericht 25-07-2005 18:48 (27%)

Voor het stukje met plaats, oppervlakte en de gegevens kun je ook prima een tabelletje gebruiken. Het zijn immers gewoon zuivere gegevens die je opnoemt.

alt="Image of the object" is natuurlijk gewoon fout, omdat de alt-tekst niet in de taal van je document is.

quote:

mophor schreef op maandag 25 juli 2005 @ 18:41:
kijk eens naar een dl

verder is h1 echt een block element hoor, die mag ook never niet in een p

verder mogen genestte p's ook niet. Misschien moet je de specs toch iets beter doorlezen, zelfs in die 10 min HTML guide die al genoemd is staat een dl genoemd overigens. Er zijn een hoop nuttige links langsgekomen, lees je die ook door?

id=recent lijkt me niet handig, ga je al die blokken aan de rechterkant recent noemen? Naast het blok links en midden is rechts volgens mij een apart "hoofdstuk" je zou daarvoor zelfs een h1 recent kunnen doen, de blokken erin zijn paragrafen erbinnen


HTML:

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<div id="recent">     <h1>recent</h1> <!-- deze geef je niet weer dmv css -->     <div>       <h2>Van der Helstraat 50</h2>       <p>[img]"../images/image_small.png"[/img]</p>       <dl>             <dt>Plaats: </dt>             <dd>Leeuwarden</dd>         </dl>     </div>     <div>       <!-- volgende huis -->     </div> </div>

edit: dit is dus voor het complete rechter deel. Als algemene tip: probeer je css zo min mogelijk van id's en classes af te laten hangen, het hele rechter deel kan je selecteren op het id=recent

die h1 heb ik erbij gezet voor de duidelijkheid, da's wellicht handig voor text- en speechbrowsers. met css laat je die gewoon niet zien als je dat niet wilt: #recent h1 {display: none}

Ik heb je tips toegepast. Ik vraag me alleen af hoe ik de automatische pagebreak na het dt-element uit kan zetten? page-break-after: none; werkt in ieder geval niet in MSIE.

Edit:

Bovenstaand probleem is inmiddels opgelost d.m.v. een float: left.

deprogrammeur wijzigde dit bericht 26-07-2005 12:55 (11%)

Inmiddels heb ik het document af:

HTML:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html>     <head>         <title>Untitled Document</title>         <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />         <link href="../styles/style.css" rel="stylesheet" type="text/css" />     </head>     <body>         <div class="structure" id="navigation">             <map name="navigation">                 <h1>Woningaanbod</h1>                 <ul>                     <li><a href="javascript://">» Kopen</a></li>                     <li><a href="javascript://">» Verkopen</a></li>                     <li><a href="javascript://">» Bestaande bouw</a></li>                     <li><a href="javascript://">» Nieuwbouw</a></li>                 </ul>             </map>             [img]"../images/navigation_bottom_illustration.png"[/img]         </div>         <div class="structure" id="overview">             <h1>Bestaande bouw</h1>             <map name="navigation">                 <p><a href="javascript://">[img]"../images/page_navigation_previous.png"[/img]</a> Pagina 1 van 6 <a href="javascript://">[img]"../images/page_navigation_next.png"[/img]</a></p>             </map>             <p><span class="quantity">29</span> object(en) gevonden in de categorie: <a href="javascript://">bestaande bouw</a>.</p>               <p>                 <div class="objects">                     <h1>Akkrum, Buterwal 8</h1>                     <p>[img]"../images/image.png"[/img]</p>                     <p><span class="price">Vraagprijs:</span> E 480.000,- kk <span class="status">Status: </span><span class="statusSold">verkocht OV</span></p>                     <p>                         In het centrum bij de pasagiershaven gelegen                         uitstekend onderhouden VRIJSTAANDE VILLA met                         GARAGE en AANLEGPLAATS... <a href="javascript://">Lees Verder »</a>                      </p>                 </div>                 <div class="objects">                     <h1>Akkrum, Buterwal 8</h1>                     <p>[img]"../images/image.png"[/img]</p>                     <p><span class="price">Vraagprijs:</span> E 480.000,- kk <span class="status">Status: </span><span class="statusForSale">Te koop</span></p>                     <p>                         In het centrum bij de pasagiershaven gelegen                         uitstekend onderhouden VRIJSTAANDE VILLA met                         GARAGE en AANLEGPLAATS... <a href="javascript://">Lees Verder »</a>                      </p>                 </div>             </p>             <map name="navigation">                 <p><a href="javascript://">[img]"../images/page_navigation_previous.png"[/img]</a> Pagina 1 van 6 <a href="javascript://">[img]"../images/page_navigation_next.png"[/img]</a></p>             </map>         </div>         <div id="recent">             <div>                 <h1>Paulus Moreelstraat 6</h1>                   <p>[img]"../images/image_small.png"[/img]</p>                   <dl>                     <dt>Plaats: </dt>                     <dd>Leeuwarden</dd>                     <dt>Status: </dt>                     <dd>te koop</dd>                     <dt>Opp. perceel: </dt>                     <dd>86 m2</dd>                     <dt>Vraagprijs: </dt>                     <dd>20.990.000,- kk</dd>                 </dl>             </div>             <div>                 <h1>Paulus Moreelstraat 6</h1>                   <p>[img]"../images/image_small.png"[/img]</p>                   <dl>                     <dt>Plaats: </dt>                     <dd>Leeuwarden</dd>                     <dt>Status: </dt>                     <dd>te koop</dd>                     <dt>Opp. perceel: </dt>                     <dd>86 m2</dd>                     <dt>Vraagprijs: </dt>                     <dd>20.990.000,- kk</dd>                 </dl>             </div>             <div>                 <h1>Paulus Moreelstraat 6</h1>                   <p>[img]"../images/image_small.png"[/img]</p>                   <dl>                     <dt>Plaats: </dt>                     <dd>Leeuwarden</dd>                     <dt>Status: </dt>                     <dd>te koop</dd>                     <dt>Opp. perceel: </dt>                     <dd>86 m2</dd>                     <dt>Vraagprijs: </dt>                     <dd>20.990.000,- kk</dd>                 </dl>             </div>         </div>     </body> </html>

Ik heb het document getest tegen de W3-validator en ik kreeg nog wel een paar fouten, maar die zijn waarschijnlijk aan de inspringen te wijten?

quote:

Below are the results of attempting to parse this document with an SGML parser.

1.

Line 6, column 68: document type does not allow element "LINK" here

...yles/style.css" rel="stylesheet" type="text/css" />

The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).

✉
2.

Line 7, column 7: end tag for element "HEAD" which is not open

</head>

The Validator found an end tag for the above element, but that element is not currently open. This is often caused by a leftover end tag from an element that was removed during editing, or by an implicitly closed element (if you have an error related to an element being used where it is not allowed, this is almost certainly the case). In the latter case this error will disappear as soon as you fix the original problem.

If this error occured in a script section of your document, you should probably read this FAQ entry.

✉
3.

Line 8, column 6: document type does not allow element "BODY" here

<body>

✉
4.

Line 52, column 6: end tag for element "P" which is not open

</p>

deprogrammeur wijzigde dit bericht 26-07-2005 13:35 (23%)

HTML:

1 2	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="../styles/style.css" rel="stylesheet" type="text/css">

This should do the trick! Verderop heb je een onnodige <p> die kan je even weghalen. Weet niet of je nesting wel goed is (regel 27 en 48 heb ik weggehaald)

Daarnaast zou ik zelf gebruik maken van het stricte document model, maar die keuze is aan jou

ik zou die h1 van de huizen namen door h2 vervangen, ze zitten duidelijk onder de h1 "bestaande bouw" ook in je recent blok zitten ze een niveau lager eigenlijk (vandaar mijn suggestie van een hidden h1, dat maakt de boel wat logischer in elkaar.

alle hx elementen samen zouden een nette inhoud van je pagina moeten vormen

gooi de boel eens zonder css online, en kijk dan of het er logisch uitziet, dat zou wel het geval moeten zijn.

mophor wijzigde dit bericht 26-07-2005 14:00 (12%)

De code met doorgevoerde wijzigingen ('100% valide HTML 4.01 transitioneel' volgens de W3-validator) :

HTML:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html>     <head>         <title>Untitled Document</title>         <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">         <link href="../styles/style.css" rel="stylesheet" type="text/css">     </head>     <body>         <div class="structure" id="navigation">             <map name="navigation">                 <h1>Woningaanbod</h1>                 <ul>                     <li><a href="javascript://">» Kopen</a></li>                     <li><a href="javascript://">» Verkopen</a></li>                     <li><a href="javascript://">» Bestaande bouw</a></li>                     <li><a href="javascript://">» Nieuwbouw</a></li>                 </ul>             </map>             [img]"../images/navigation_bottom_illustration.png"[/img]         </div>         <div class="structure" id="overview">             <h1>Bestaande bouw</h1>             <map name="navigation">                 <p><a href="javascript://">[img]"../images/page_navigation_previous.png"[/img]</a> Pagina 1 van 6 <a href="javascript://">[img]"../images/page_navigation_next.png"[/img]</a></p>             </map>             <p><span class="quantity">29</span> object(en) gevonden in de categorie: <a href="javascript://">bestaande bouw</a>.</p>             <div class="objects">                 <h2>Akkrum, Buterwal 8</h2>                 <p>[img]"../images/image.png"[/img]</p>                 <p><span class="price">Vraagprijs:</span> E 480.000,- kk <span class="status">Status: </span><span class="statusSold">verkocht OV</span></p>                 <p>                     In het centrum bij de pasagiershaven gelegen                     uitstekend onderhouden VRIJSTAANDE VILLA met                     GARAGE en AANLEGPLAATS... <a href="javascript://">Lees Verder »</a>                  </p>             </div>             <div class="objects">                 <h2>Akkrum, Buterwal 8</h2>                 <p>[img]"../images/image.png"[/img]</p>                 <p><span class="price">Vraagprijs:</span> E 480.000,- kk <span class="status">Status: </span><span class="statusForSale">Te koop</span></p>                 <p>                     In het centrum bij de pasagiershaven gelegen                     uitstekend onderhouden VRIJSTAANDE VILLA met                     GARAGE en AANLEGPLAATS... <a href="javascript://">Lees Verder »</a>                  </p>             </div>             <map name="navigation">                 <p><a href="javascript://">[img]"../images/page_navigation_previous.png"[/img]</a> Pagina 1 van 6 <a href="javascript://">[img]"../images/page_navigation_next.png"[/img]</a></p>             </map>         </div>         <div id="recent">             <h1>Recent</h1>             <div>                 <h2>Paulus Moreelstraat 6</h2>                   <p>[img]"../images/image_small.png"[/img]</p>                   <dl>                     <dt>Plaats: </dt>                     <dd>Leeuwarden</dd>                     <dt>Status: </dt>                     <dd>te koop</dd>                     <dt>Opp. perceel: </dt>                     <dd>86 m2</dd>                     <dt>Vraagprijs: </dt>                     <dd>20.990.000,- kk</dd>                 </dl>             </div>             <div>                 <h2>Paulus Moreelstraat 6</h2>                   <p>[img]"../images/image_small.png"[/img]</p>                   <dl>                     <dt>Plaats: </dt>                     <dd>Leeuwarden</dd>                     <dt>Status: </dt>                     <dd>te koop</dd>                     <dt>Opp. perceel: </dt>                     <dd>86 m2</dd>                     <dt>Vraagprijs: </dt>                     <dd>20.990.000,- kk</dd>                 </dl>             </div>             <div>                 <h2>Paulus Moreelstraat 6</h2>                   <p>[img]"../images/image_small.png"[/img]</p>                   <dl>                     <dt>Plaats: </dt>                     <dd>Leeuwarden</dd>                     <dt>Status: </dt>                     <dd>te koop</dd>                     <dt>Opp. perceel: </dt>                     <dd>86 m2</dd>                     <dt>Vraagprijs: </dt>                     <dd>20.990.000,- kk</dd>                 </dl>             </div>         </div>     </body> </html>

gaat de goeie kant op, nog wat opmerkingen

- je hebt verschillende elementen met name="navigation" nu hoeven names geloo fik niet strikt uniek te zijn maar dat zou ik wel doen

- waar is de class op de elementen met class="object" voor? om zet te onderscheiden kan, maar dan lijkt het mij dat de div's in het laatste stuk van hetzelfde type moeten zijn. Voor css is het iig niet nodig omdat je deze div's al kan bereiken met "#overview div {}" (wat ik zeker aanraad)

- ook het gebruik van class="structure" volg ik niet helemaal. Bedenk goed of je classen van elementen zou willen onderscheiden en hoe ze dan zouden moeten heten. Voor de CSS zou het iig niet nodig hoeven zijn, als ik zo effe snel kijk.

Transactional en strict ineen, verbaast me dat dat wordt gevalideerd

Recommended DTDs to use in your Web document.

quote:

BtM909 schreef op dinsdag 26 juli 2005 @ 15:27:
Transactional en strict ineen, verbaast me dat dat wordt gevalideerd

Recommended DTDs to use in your Web document.

Ja dat was een foutje. Ik had alleen even de DTD aangepast zonder op de rest van het doctype te letten.

quote:

mophor schreef op dinsdag 26 juli 2005 @ 15:26:
gaat de goeie kant op, nog wat opmerkingen

- je hebt verschillende elementen met name="navigation" nu hoeven names geloo fik niet strikt uniek te zijn maar dat zou ik wel doen

- waar is de class op de elementen met class="object" voor? om zet te onderscheiden kan, maar dan lijkt het mij dat de div's in het laatste stuk van hetzelfde type moeten zijn. Voor css is het iig niet nodig omdat je deze div's al kan bereiken met "#overview div {}" (wat ik zeker aanraad)

- ook het gebruik van class="structure" volg ik niet helemaal. Bedenk goed of je classen van elementen zou willen onderscheiden en hoe ze dan zouden moeten heten. Voor de CSS zou het iig niet nodig hoeven zijn, als ik zo effe snel kijk.

1. Je hebt gelijk, ik had het even snel aangepast om de validator te plezieren.
2. 'Objects' slaat op de blokken met huizeninformatie. Ik heb de klasse 'objects' inmiddels verwijderd.
3. 'Structure' gebruik ik juist op jouw aanraden? Je adviseert toch op je website om de div-elementen die voor de structuur van je website zorgen de klasse 'structure' mee te geven?

Edit:

Waarom is het beter om de afbeelding in een aparte paragraaf te plaatsen i.p.v. hem binnen de paragraaf waarin ook de tekst staat te zetten?

Edit 2:

Zou je die huizenopsomming ook in een tabel mogen zetten?

deprogrammeur wijzigde dit bericht 26-07-2005 16:09 (53%)

HTML:

1	<a href="javascript://">

"als het geen link is, gebruik dan geen anchor..."

quote:

crisp schreef op dinsdag 26 juli 2005 @ 16:10:
HTML:

1	<a href="javascript://">

"als het geen link is, gebruik dan geen anchor..."

Het is een opzet voor een template, dus die links worden later ingevuld.

huizenopsomming kan ook in een tabel, dan is elk huis een soort record
wat je ook kan doen is wat cheatah aangaf, alleen de eigenschappen in een tabel ipv een dl, denk dat dat niet heel veel uitmaakt, maar als ik kijk naar hoe je ontwerp in elkaar steekt lijkt me de huidige structuur makkelijker stylen dan een tabel

class="structure" geef ik idd ook aan div's die verder geen semantische waarde hebben en dus puur voor structuur (/opmaakdoeleinden) zijn toegevoegd. In jouw geval is dat volgens mij alleen de eerste.

Afbeeldingen kan je in een paragraaf zetten als ie ermee gerelateerd is. Je moet zelf even bedenken in hoeverre dat het geval is. Het komt niet zo heel nauw imho.

Je hebt nu de belangrijkste dingen op orde denk ik, dingen als wel of geen classes, en de naam ervan, een paar extra div's omwille van opmaak, plaatjes al of niet bij een paragraaf trekken of een tabel ipv een dl zijn allemaal kleine dingetjes, kies gewoon wat het makkelijkst te stylen valt en wat voor jou het handigst overkomt.

quote:

mophor schreef op dinsdag 26 juli 2005 @ 16:20:
huizenopsomming kan ook in een tabel, dan is elk huis een soort record
wat je ook kan doen is wat cheatah aangaf, alleen de eigenschappen in een tabel ipv een dl, denk dat dat niet heel veel uitmaakt, maar als ik kijk naar hoe je ontwerp in elkaar steekt lijkt me de huidige structuur makkelijker stylen dan een tabel

class="structure" geef ik idd ook aan div's die verder geen semantische waarde hebben en dus puur voor structuur (/opmaakdoeleinden) zijn toegevoegd. In jouw geval is dat volgens mij alleen de eerste.

Afbeeldingen kan je in een paragraaf zetten als ie ermee gerelateerd is. Je moet zelf even bedenken in hoeverre dat het geval is. Het komt niet zo heel nauw imho.

Je hebt nu de belangrijkste dingen op orde denk ik, dingen als wel of geen classes, en de naam ervan, een paar extra div's omwille van opmaak, plaatjes al of niet bij een paragraaf trekken of een tabel ipv een dl zijn allemaal kleine dingetjes, kies gewoon wat het makkelijkst te stylen valt en wat voor jou het handigst overkomt.

Okee, thanks! Blijf ik alleen met die border-attribuut zitten die ik omwille van MSIE aan de paginanavigatie moet toevoegen:

HTML:

1	<a href="javascript://">[img]"../images/page_navigation_next.png"[/img]</a>

deprogrammeur wijzigde dit bericht 26-07-2005 16:58 (14%)

code:

img {
    border: none;
}

quote:

Bosmonster schreef op dinsdag 26 juli 2005 @ 17:01:
code:

img {
    border: none;
}

Vaag.. nu werkt het wel inderdaad. Thanks!