webpagina maken met plaatjes en <li></li> tags??? volgens html strict + css

[djeric]

hallo.

ik was bezig met een cursus website bouwen aan het leren hier op helpmij.

zie: http://www.helpmij.nl/forum/showthread.php/512516-website-opmaak-help

Nu wil ik volgens html strict en css verder gaan met een andere pagina maar weet niet hoe het verder moet.

ik wil allerlei plaatjes van mis drankjes tonen met daarnaast wat er allemaal inzit. (zoiets met bv <li></li> tags!)

Maar hoe en wat begin ik???
moet ik nu een tabel gaan maken??? (word toch niet goed ondersteunt door vele browsers?

het moet voor de meeste internetters goed te lezen zijn en werken!

iemand enige idee wat ik moet doen???????

in de bijlage zie je een voorbeeld van een pagina dat ik ongeveer zo wil gaan maken.

 

[Woutertjuh88]

waarom niet met divjes naast elkaar?
je kunt ze makkelijk tegen elkaar aanplakken met float:left; -> css

 

[That Guy]

Oh, tabellen werken heel goed in alle browsers hoor, maar die zijn er niet voor bedoeld. Je kan beter voor zoiets gaan:

<div class='item'>
   <img src='flugel.png' alt='flugel' />
   <span class='beschrijving'>
      Dit is flugel en het ruikt naar kauwgomballen
   </span>
</div>

<!-- herhaal dit voor al je items -->

/* css */

div.item
{
   width: 250px;   /* veranderen */
   float: left;

   margin: 5px 10px 5px 0px;
}

div.item img
{
   display: block;   /* forceer de span eronder */
}

span.beschrijving
{
   color: #f06;
}

bijvoorbeeld.

 

[defietser]

Eric,
Dat is nu eens typisch een vb om voor een tabel te gaan, linkse cel een plaatje en rechtse cel de data die je eventueel uit een database kan lezen of in uw geval zal dat nog wel gewoon in de cel plaatsen zijn.
Mvg
Defietser

 

[djeric]

Oh, tabellen werken heel goed in alle browsers hoor, maar die zijn er niet voor bedoeld.

Eric,
Dat is nu eens typisch een vb om voor een tabel te gaan,r

dit is nu een menigs verschil en ik begrijp heel die html strict niet met gebruik van css.

ik ben al een tijdje bezig geweest en alle pagina's die ik nu af hebt zijn foutloos gemaakt. doordat ik hier op helpmij steeds een vraag stelde als ik iets niet begrijpt. En leer daar weer van. nu kan ik steeds makelijker de html code begrijpen, en zelf aanpassen.

maar nu heb ik een andere pagina, met hier een nieuwe onderwerp.

Kijk nog eens in mijn bijlage voorbeeld van hoe ik eerst met behulp van een tabel de opmaak hebt gemaakt.
je ziet steeds 3 plaatjes van drankjes, en daarnaast de titel van het drankje in een rode kleur, en de beschrijving van wat er in die drankjes zit in een blauwe kleur die tevens als een <li></li> tag is opgemaakt.

nu wil ik weer zoiets, maar het gebruik van tabellen word afgeraden, al zijn de meningen verschillend ??? ik heb begrepen dat ik voor de nieuwe browser taal moet gaan en alles volgens html strict opbouw en een nette css.

maar ben al niet handig waar je de codes plaatst, hoe de code er ongeveer uit moet zien. maar wat ik wel een beetje weet. ik moet iets met div. gaan doen. maar begrijp niet echt hoe de code eruit komt te zien.

een tabel maken moet nu wel te doen zijn. maar moet ik nu een plaatje in een tabel maken? en rechts een <li></li> tag ???

de pagina waar het moet komen = : http://members.home.nl/ebosmannetjes/drankjes.html

een tabel met een plaatje ziet er nog simpel uit, zie: http://members.home.nl/ebosmannetjes/skihut.html maar dan in iedere tabel een plaatje en iets van bv een <li></li> tag word ingewikkelder...

iemand enige idee hoe je me kan vertellen wat te doen? zodat het de juiste manier is???

 

[ecross]

dit is nu een menigs verschil en ik begrijp heel die html strict niet met gebruik van css.

html strict lijkt heel erg op gewone html, maar dan met wat extra regels (zie google), css gebruik je om nog meer opmaak aan je website te geven, (voor tutorials zie google)

nu wil ik weer zoiets, maar het gebruik van tabellen word afgeraden, al zijn de meningen verschillend ???

1 reden om geen tabellen te gebruiken: de browser kan de inhoud van je website pas laten zien als alle inhoud van de tabel is geladen, zeker met afbeeldingen kan dat lang duren.

iemand enige idee hoe je me kan vertellen wat te doen? zodat het de juiste manier is???

ik heb hier een voorbeeld met gebruik van lists (ol / ul / li) en div's

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<body>
<ul>
   <li>
      <div><h2>drankje 1</h2></div>
      <div style='width:40%; float:left;'><img src="..." /></div>
      <div style='width:40%;  float:left;'>
        <ul>
           <li>ingrediënt 1</li>
           <li>ingrediënt 2</li>
           <li>ingrediënt 3</li>
        </ul>
      </div>
  </li>
  <li style='clear:left;'>
      <div><h2>drankje 2</h2></div>
      <div style='width:40%; float:left;'><img src="..." /></div>
      <div style='width:40%;  float:left;'>
        <ul>
           <li>ingrediënt 1</li>
           <li>ingrediënt 2</li>
           <li>ingrediënt 3</li>
        </ul>
      </div>
  </li>
</ul>
</body>
</html>

door deze doctype boven je html te zetten vertel je de browser dat je html strict gebruikt,
je gebruikt html strict bijvoorbeeld bij de zelf afsluitende img tag (/ aan het einde van de tag i.p.v. </img>)
de css die je gebruikt staat in de style='......' tag, nu gebruik je bijvoorbeeld:
width:40%; de breedte 40% van het boven liggende element
float:left; tegen het links liggende element aan "drijven"
clear:left; zorgt dat er links geen drijvende elementen liggen.

als je nog vragen hebt, zeg je het maar.

Ecross

 

[djeric]

door deze doctype boven je html te zetten vertel je de browser dat je html strict gebruikt,
je gebruikt html strict bijvoorbeeld bij de zelf afsluitende img tag (/ aan het einde van de tag i.p.v. </img>)
de css die je gebruikt staat in de style='......' tag, nu gebruik je bijvoorbeeld:
width:40%; de breedte 40% van het boven liggende element
float:left; tegen het links liggende element aan "drijven"
clear:left; zorgt dat er links geen drijvende elementen liggen.

als je nog vragen hebt, zeg je het maar.

Ecross

de bassis wist al, van html strict. (heb ik eerder geleerd hie rop helpmij.

maar begrijp deze uitleg niet.

ik heb al een webpagina, maar deze moet nog verder ingevuld worden.

ik heb nu de html code tussen de <body> en de </body> tags overgenomen en in mijn html geplaatst. maar de resultaat is:

zie bijlage van mijn screenshot

maar ik moet toch een andere css maken? (iedere pagina een andere css code?)

ik weet iets te weinig van die codes, en plaatsing af. maar wil het daarom ook leren.... maar hoe en waar ik ze plaatst weet ik niet altijd. en vooral hoe je een code maakt. dat weet ik helemaal al niet. (wel steeds beter door jullie hulp)

maar hoe krijg ik hem nu wel goed?????? want volgens de bijlage die je nu ziet is hij verspreid op mij pagina en niet zoals in de bijlage van mijn 1e bericht hier. netjes naarst elkaar

 

[djeric]

weet iemand hoe ik het nu moet doen dan???

want krijg het niet voor elkaar.

 

[bmtvrr]

wat wil je nu precies bereiken? Mij is het niet helemaal duidelijk

 

[djeric]

wat wil je nu precies bereiken? Mij is het niet helemaal duidelijk

het zelfde als in bijlage 1 dat wil ik..... (zie me 1e bericht hierboven)

maar het ziet er nu zo uit als ik dit topic volg. (zie bijlage 2 in onderste bericht)

 

[bmtvrr]

dat is toch niet dezelfde inhoud, of vergis ik me?

 

[djeric]

dat is toch niet dezelfde inhoud, of vergis ik me?

nee de inhoud niet...

maar wel het geen wat in de onderste inhoud moeten komen:

zie: http://members.home.nl/ebosmannetjes/drankjes.html

ik wil op die pagina dranken tonen.
met een titel (in kleur)
en daarnaarst wat er in die dranken zit.

In mijn bovenste bijlage zie je ongeveer hoe het eruit moet komen te zien wat ik bedoel.

als je dat schermpje nu ff op: http://members.home.nl/ebosmannetjes/drankjes.html
tussen propt krijg je wat ik eigenlijk nodig hebt....

maar ja dan heb ik wel hulp nodig van iemand die de juiste html strict code met css kan geven, zodat dat werkt en mij beetje is uitgelegd hoe het werkt.

ik hoop dat me vraag nu duidelijker is geworden hiermee???

 

[bmtvrr]

ik ben geen held met html en css, maar ik zal eens kijken of ik je kan helpen

 

[djeric]

ik ben geen held met html en css, maar ik zal eens kijken of ik je kan helpen

ach in iedergeval ernorm bedankt alvast,

jammer dat de prof. hier niet op reageren (of weten ze het ook niet) ???

Ik heb vaag het vermoeden zoals de fietser het zegt: alles in een tabel moet komen.

laat zeggen dat dat de oplossing is, hoe kan ik dan het beste de html code schrijven??????

(ik ben een leek in html strict en css) - laat staan hoe je iets plaatst.

 

[defietser]

@djeric

jammer dat de prof. hier niet op reageren (of weten ze het ook niet) ???

Weten het wel maar zien het bos niet meer door de bomen want hoe moet je hier aan beginnen.
je hebt op die pagina

http://members.home.nl/ebosmannetjes/drankjes.html

1 header
2 menus een rechts en een links
1 titel "apresski drankjes"
3 fotos en dan nog een laatst update item

Dat is dus alles, maar daarvoor voor die enkele simpele dingen heb je een css met maar liefst 5000 lijnen code met de lege regels erin kom ik hier op 11556 lijnen.

Denk dan maar niet dat daar iemand met een kennis van zaken daar zal op reageren.
Hoe je daar aangeraakt bent weet ik niet enfin ongeveer wel.
Ik reageer daar even nu op. Maar om daar aan te beginnen zie ik dat nu ook niet zitten dan komt er dan nog bij zou je die dan nog kunnen aanpassen en of onderhouden.
Eric veel suc6 met je pogingen om je eigen webmaster te worden.
Mvg
Defietser

 

[djeric]

Ik begrijp het probleem niet meer hoor

het geen wat ik tot nu toe op: http://members.home.nl/ebosmannetjes/ hebt staan heb ik allemaal gelleerd hier op: http://www.helpmij.nl/forum/showthread.php/512516-website-opmaak-help

Alles is tot nu toe foutloos geplaatst, en alle pagina's werken.

Waarom is het nu een probleem dat niemand mij wilt helpen dan???????? ik begrijp weinig van html strict en css code als niemand mij de verdere stappen leert.

mijn css tot nu is:

body { 
background : url(index/achtergrond.jpg); 
} 
ul.navigatie { 
font-family : verdana, Arial, Helvetica, sans-serif; 
font-size : 14px; 
font-weight : bold; 
width : 12em; 
border-right : 1px solid #666; 
padding : 0; 
margin : 0 10px 1em 0; 
background-color : #9cc; 
color : #333; 
list-style : none; 
float : left; 
} 
ul.rechts { 
float : right; 
margin : 0 0 1em 10px; 
} 
ul.navigatie li { 
margin : 0; 
border-top : 1px solid #003; 
} 
ul.navigatie li a { 
display : block; 
padding : 2px 2px 2px 4px; 
border-left : 10px solid #990000; 
border-right : 1px solid #69c; 
border-bottom : 1px solid #369; 
background-color : #000099; 
color : #c0c0c0; 
text-decoration : none; 
width : 100%; 
} 
ul.rechts { 
margin : 0 0 1em 10px; 
} 
html > body ul.navigatie li a { 
width : auto; 
} 
ul.navigatie li a:hover { 
border-left : 10px solid #006600; 
border-right : 1px solid #69c; 
border-bottom : 1px solid #369; 
background-color : #ffff00; 
color : #ff1493; 
} 
div#welkom { 
text-align : center; 
} 
#inleiding { 
color : #330000; 
font-weight : bold; 
font-size : 1.6em; 
} 
h1#home { 
color : maroon; 
font-size : 1.5em; 
text-align : center; 
} 
p#fotos { 
clear : both; 
text-align : center; 
} 
img#links { 
float : left; 
} 
img#rechts { 
float : right; 
} 
div#tip { 
color : blue; 
clear : both; 
float : left; 
width : 45%; 
} 
h2#homeupdate { 
color : #003366; 
margin : 0; 
float : left; 
} 
h2#updatecenter { 
color : #003366; 
margin : 0; 
text-align : center; 
} 
div#teller { 
float : right; 
} 
p#stealth { 
margin : 0; 
} 
table { 
text-align : center; 
border : 5px outset black; 
background : black; 
margin : 0 auto; 
} 
tr#kop { 
height : 30px; 
font-size : 1.1em; 
font-weight : bold; 
color : #c0c0c0; 
background : #c30; 
} 
tr#kop td { 
width : 200px; 
} 
tr { 
height : 40px; 
background : #00c; 
color : #ff0; 
} 
#inhoud { 
margin : 0 12.5em; 
} 
h1#kop1 { 
color : maroon; 
font-size : 1.5em; 
text-align : center; 
} 
#inf1 { 
color : #330000; 
font-weight : bold; 
font-size : 1.3em; 
} 
#inf2 { 
color : #330000; 
font-weight : bold; 
font-size : 1.3em; 
} 
#inf3 { 
color : #330000; 
font-weight : bold; 
font-size : 1.3em; 
} 
h1#kop2 { 
color : maroon; 
font-size : 1.5em; 
text-align : center; 
} 
#inf4 { 
color : #330000; 
font-weight : bold; 
font-size : 1.3em; 
} 
#inf5 { 
color : #330000; 
font-weight : bold; 
font-size : 1.3em; 
} 
#inf6 { 
color : #330000; 
font-weight : bold; 
font-size : 1.3em; 
} 
h1#nederland { 
color : maroon; 
font-size : 1.5em; 
text-align : center; 
} 
h1#drankjes { 
color : maroon; 
font-size : 1.5em; 
text-align : center; 
}

ik wou alleen verder gaan met de volgende pagina, het geen wat ik daar nodig hebt heb ik gekopiert en de rest weg gelaten. volgens de validator's van css en html staat alles foutloos erop.

ik zie het probleem ook niet waarom men nu zo reageerd???

is eht een rommeltje in me css? leg me uit wat dan vooraf verbeterd moet worden ergens dan. ik snap er helemaal niets van.

ik vind het alleen raar, dat dan niemand reageerde op een vraag waarvan ik dacht iets wat de prof. mij wel zou kunnen leren, maar deze reactie had ik niet verwacht, en begrijp het ook niet.

het klinkt als: het is een grote rotzooi op je site, zoek het maar uit!!!

Wat moet ik nu dan doen??????

 

[defietser]

Ja Eric, denk dat ik gisteren aan het slapen was had een verkeerde css bij uw html geplaatst daarom was het hier een zootje bij mij
Sorry daarvoor.
Wel ik heb er een tabel in geplaatst waar je uw drankjes met foto en en beschrijving kan in plaatsen.Ik heb er 2 ingevuld om een bv te maken de foto's moet je dan maar zelf aanpassen even als tekst.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="nl">
    <head>
	
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	
	<meta name="keywords" content=" skihut,Feesten,Partys,Muziek,Informatie,Apresski,Verhuren,Feestcafé,Diskjockey,Drive in show,Tirol,Oostenrijk,Boekingen,Sneeuw,Schuim party,Ambiance">
	
 <meta name="description" content="Wat is een skihut? Lees op deze site daar meer over."> 
	
    <title>Apres ski drankjes.</title>
	
    <style type="text/css">
    </style>
	
	<link rel="stylesheet" type="text/css" href="style.css">

	
</head>
<body>
<div id="welkom">
<img alt="welkom" src="index/welkom.jpg" width="400" height="104">

</div>
    <ul class="navigatie">
        <li><a title="Index pagina" href="index.html">home</a></li>
        <li><a title="Informatie over een skihut." href="informatie.html">Informatie</a></li>
        <li><a title="Stuur een email." href="mailto:skihutinfo@ziggo.nl">contact</a></li>

        <li><a title="Sorry pagina niet actief." href="artiesten.html">---</a></li>
        <li><a title="vacatures in een skihut." href="vacatures.html">vacatures</a></li>
        <li><a title="Skihutten in Nederland." href="skihut.html">skihut nederland</a></li>
        <li><a title="Sorry pagina niet actief." href="dj.html">---</a></li>
        <li><a title="Sorry pagina niet actief." href="forum.html">---</a></li>
        <li><a title="Skihutten in het buitenland" href="buitenland.html">skihut buitenland</a></li>

        <li><a title="Sorry pagina niet actief." href="cd.html">---</a></li>
    </ul>
    <ul class="navigatie rechts">
        <li><a title="Sorry pagina niet actief." href="downloads.html">---</a></li>
        <li><a title="Apresski evenementen." href="evenementen.html">evenementen</a></li>
        <li><a title="Sorry pagina niet actief." href="ontoer.html">---</a></li>
        <li><a title="Apresski drankjes" href="drankjes.html">apresski drankjes</a></li>

        <li><a title="Sorry pagina niet actief." href="sponsers.html">---</a></li>
        <li><a title="Sorry pagina niet actief." href="drivein.html">---</a></li>
        <li><a title="Beluister hier naar de apresski radio" href="javascript:void(0)" onclick="open('http://www.radio538.nl/web/show/id=675518','miniwin','width=320,height=280')">muziek speler</a></li>
		<li><a title="schrijf in mijn gastenboek" href="http://apresskihutinfo.mygb.nl">gastenboek</a></li>
        <li><a title="Sorry pagina niet actief." href="links.html">---</a></li>
        <li><a title="Sorry pagina niet actief." href="vragen.html">---</a></li>

    </ul>
	    <div id= "inhoud"> 

        <h1 id="drankjes">apresski drankjes</h1>
		<table width="100%" cellpadding="5" >
  <tr>
    <td width="125" height="186" align="left" valign="top" > <img src="images/drankjes2.jpg" width="125" height="186"></td>
    <td align="left" valign="top"><p>Een Smoothie is een gezond alcoholvrij en koud drankje. De   ingrediënten zijn meestal ijs, vers fruit, melkproducten (yoghurt, melk,   room) en suiker (of honing). Deze ingrediënten worden in een blender   gemixt tot een romige consistentie.</p></td>
  </tr>
  <tr>
     <td width="125" align="left" valign="top"><img src="images/031209_tom.jpg" width="125" height="96"></td>
    <td>Een Smoothie is een gezond alcoholvrij en koud drankje. De ingrediënten zijn meestal ijs, vers fruit, melkproducten (yoghurt, melk, room) en suiker (of honing). Deze ingrediënten worden in een blender gemixt tot een romige consistentie.</td>
      </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>

		</div>
		
		<p id="fotos" style="text-align: center; clear: both;">
    <img id="links" src="div/1.jpg" alt="Foto 1" width="300" height="225">
    <img id="rechts" src="div/2.jpg" alt="Foto 2" width="300" height="225">
    <img src="div/3.jpg" alt="Foto 3" width="300" height="225">
</p>

		
<h2 id="updatecenter">last update: 11-6-2010</h2>
		
</body>
</html>

Om er nog bij te voegen hoef je alleen dit te copëeren

<tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>

en onder de laatste te plakken voor </table>

Hopelijk ben hiermee een beetje geholpen

Mvg
Defietser

 

[djeric]

Hopelijk ben hiermee een beetje geholpen

Mvg
Defietser

zeer zeker wel :thumb: alle hulp is gewaardeerd!:thumb:~en ja fouten maken we allemaal hoor, geen punt, ik dacht alleen ff dat ik een verkeerde opmerking had geplaatst en niemand mij daarom wilde helpen. (omdat het te veel werk zou ziin)

Ik ben daarom blij dat ik hier op helpmij een topic kan starten en dat ze dan alles rustig kunnen uitleggen van hoe alles werkt,moet en bij te houden is.

Straks leer ik netzoveel als wat je uit een boek kan halen. niet alles heeft zin om te leren. en dmv hier krijg ik een duidelijke uitleg. tevens snap ik iets niet, vraag ik het hier opnieuw.

maar goed even over mijn pagina momenteel: drankjes.html

alleen ipv die tekst wou ik voor ieder plaatje een bijbehorende titel weer laten geven, en een <li></li> tag aan toevoegen. (als de <li></li> tag geacepteerd word in html strict ???

momenteel staan er 4 fouten op de html validator van deze pagina die ik nu geupload hebt staan.
iets over fouten van height en widht, maar begrijp niet wat ze ermee bedoelen.

als aller eerst zal deze fouten moeten worden opgelost, wil ik verder rommelen in mijn pagina.

Maar ik denk als ik verder zal moeten gaan in de html pagina van "drankjes.html" dat ik dan de <li></li> tag moet toevoegen in de tabel. zo juist???

 

[defietser]

Eric,
Er zijn dus 4 errors en een warning op je pagina "http://members.home.nl/ebosmannetjes/drankjes.html".

Een warning "Using Direct Input mode: UTF-8 character encoding assumed" geen probleem laten zo
Er waren 4 errors
2 errors betreft de width en de height in de td tag "niet toegelaten bij het doctype die je gebruikt"
2 errors waar de alt tag ontbrak in de img tag "verplicht in het doctype die je gebruikt"
Deze pagina is nu W3C valid.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="nl">
    <head>
    
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    
    <meta name="keywords" content=" skihut,Feesten,Partys,Muziek,Informatie,Apresski,Verhuren,Feestcafé,Diskjockey,Drive in show,Tirol,Oostenrijk,Boekingen,Sneeuw,Schuim party,Ambiance">
    
 <meta name="description" content="Wat is een skihut? Lees op deze site daar meer over."> 
    
    <title>Apres ski drankjes.</title>
    
    <style type="text/css">
    </style>
    
    <link rel="stylesheet" type="text/css" href="style.css">

 
    
</head>
<body>
<div id="welkom">
<img alt="welkom" src="index/welkom.jpg" width="400" height="104">
 
</div>
    <ul class="navigatie">
        <li><a title="Index pagina" href="index.html">home</a></li>
        <li><a title="Informatie over een skihut." href="informatie.html">Informatie</a></li>
        <li><a title="Stuur een email." href="mailto:skihutinfo@ziggo.nl">contact</a></li>

 
        <li><a title="Sorry pagina niet actief." href="artiesten.html">---</a></li>
        <li><a title="vacatures in een skihut." href="vacatures.html">vacatures</a></li>
        <li><a title="Skihutten in Nederland." href="skihut.html">skihut nederland</a></li>
        <li><a title="Sorry pagina niet actief." href="dj.html">---</a></li>
        <li><a title="Sorry pagina niet actief." href="forum.html">---</a></li>
        <li><a title="Skihutten in het buitenland" href="buitenland.html">skihut buitenland</a></li>

 
        <li><a title="Sorry pagina niet actief." href="cd.html">---</a></li>
    </ul>
    <ul class="navigatie rechts">
        <li><a title="Sorry pagina niet actief." href="downloads.html">---</a></li>
        <li><a title="Apresski evenementen." href="evenementen.html">evenementen</a></li>
        <li><a title="Sorry pagina niet actief." href="ontoer.html">---</a></li>
        <li><a title="Apresski drankjes" href="drankjes.html">apresski drankjes</a></li>

 
        <li><a title="Sorry pagina niet actief." href="sponsers.html">---</a></li>
        <li><a title="Sorry pagina niet actief." href="drivein.html">---</a></li>
        <li><a title="Beluister hier naar de apresski radio" href="javascript:void(0)" onclick="open('http://www.radio538.nl/web/show/id=675518','miniwin','width=320,height=280')">muziek speler</a></li>
        <li><a title="schrijf in mijn gastenboek" href="http://apresskihutinfo.mygb.nl">gastenboek</a></li>
        <li><a title="Sorry pagina niet actief." href="links.html">---</a></li>
        <li><a title="Sorry pagina niet actief." href="vragen.html">---</a></li>

 
    </ul>
        <div id= "inhoud"> 
 
        <h1 id="drankjes">apresski drankjes</h1>
        <table width="100%" cellpadding="5" >
  <tr>
    <td align="left" valign="top" > <img src="images/drankjes2.jpg" width="125" height="186" alt=""></td>
    <td align="left" valign="top"><p>Een Smoothie is een gezond alcoholvrij en koud drankje. De   ingrediënten zijn meestal ijs, vers fruit, melkproducten (yoghurt, melk,   room) en suiker (of honing). Deze ingrediënten worden in een blender   gemixt tot een romige consistentie.</p></td>
  </tr>

  <tr>
     <td align="left" valign="top"><img src="images/031209_tom.jpg" width="125" height="96" alt=""></td>
    <td>Een Smoothie is een gezond alcoholvrij en koud drankje. De ingrediënten zijn meestal ijs, vers fruit, melkproducten (yoghurt, melk, room) en suiker (of honing). Deze ingrediënten worden in een blender gemixt tot een romige consistentie.</td>
      </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    </tr>

  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
 
        </div>
        
        <p id="fotos" style="text-align: center; clear: both;">
    <img id="links" src="div/1.jpg" alt="Foto 1" width="300" height="225">
    <img id="rechts" src="div/2.jpg" alt="Foto 2" width="300" height="225">

    <img src="div/3.jpg" alt="Foto 3" width="300" height="225">
</p>
  
        
<h2 id="updatecenter">last update: 11-6-2010</h2>
  <p>
    <a href="http://validator.w3.org/check?uri=referer"><img
        src="http://www.w3.org/Icons/valid-html401"
        alt="Valid HTML 4.01 Strict" height="31" width="88"></a>
  </p>
      
</body>
</html>

Mvg
Defietser

 

[djeric]

Eric,
Er zijn dus 4 errors en een warning op je pagina "http://members.home.nl/ebosmannetjes/drankjes.html".

heb het aangepast, en idd werkt nu goed.

ik heb gezien dat er 2x de width en height in voorkwamen in de zelfde regel. (ik gebruik notepad ++)
maar nu zijn die eerste weg gelaten, dat is idd, de fout geweest.

alleen vraag me nog steeds af:

hoe krijg ik het volgende voor elkaar: (zie plaatje/bijlage hieronder)

een titel voor het drankje, (die rode tekst) en de inhoud van die drankjes (die blauwe tekst met een blauw puntje, oftewel de <li></li> tags ???

hoe maak je dat zo dan?

titel mag ook in kleur bv boven de foto komen, en de inhoud ernaast. of ik dit niet raadzaam???????