Hoi JohnyBoy,
Ik zie het probleem: het doet zich alleen voor in Internet Explorer. Die staat er om bekend, dat vooral tabellen uitgerekt worden al het niet moet.
Maar eerst even de complimenten voor de site: daar zit veel speur- en verzamelwerk achter! Wat een karwei zal dat geweest zijn!
Goed, hoe is nu Internet Explorer op de rails te krijgen?
Ik heb eens in de code gekeken, en oei, wat een tabellen... :shocked:
Ook de css (gecombineerd met inline styles) is niet erg overzichtelijk. Dat maakt het reuze lastig om een diagnose te stellen en een oplossing te vinden.
Maar als je besluit de tabellen vaarwel te zwaaien en over te gaan op <div>'s met css voor de opmaak, dan wordt het een stuk eenvoudiger.
En ook overzichtelijker, als je de css-classes een herkenbare naam geeft.
Want "wat was ook alweer
.style29 of
.style46 of
.style47", die Dreamweaver er zo hulpvaardig heeft in gezet?
Voorbeeld! Voor de kop wordt nu dit gebruikt:
HTML:
<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr style="display: none;">
<th bgcolor="#666666" scope="col"> </th>
<th width="1000" colspan="3" bgcolor="#666666" scope="col">
<table width="100%" height="189" border="0" align="center" cellpadding="0">
<tr>
<th bgcolor="#666666" scope="col">
<table width="100%" height="22%" border="0" align="center"
bordercolor="#FFFFFF" bgcolor="#D5EDB3">
<!--DWLayoutTable-->
<tr>
<td width="126" height="160" align="center" valign="middle" scope="col">
<div align="left"><br />
<img src="images/3fotos-logo-links.gif" alt="logol inks"
width="188" height="110" vspace="15" align="right" />
</div>
</td>
<th width="105" valign="top" scope="col">
<p align="left" class="bodyText"><br />
<img src="images/Wapen-Olsene-oud.gif" alt="wapenschild"
width="105" height="66" vspace="25" align="right" /><br />
<br /></p>
</th>
<th width="295" align="center" valign="middle" scope="col">
<p align="center" class="style4"><img src="images/titelmidden.gif"
alt="titel" width="298" height="113" align="top" />
</p>
</th>
<th width="105" align="left" valign="top" scope="col">
<div align="right">
<span class="style4"><br />
<img src="images/Wapen-Olsene-oud.gif" alt="wapenschild"
width="105" height="66" vspace="25" align="left" />
</span><br />
</div>
</th>
<td width="125" align="left" valign="top" scope="col"><br />
<img src="images/3fotos-logo-links.gif" alt="logol inks"
width="188" height="110" vspace="15" align="left" />
</td>
</tr>
</table>
</th>
</tr>
</table>
</th>
<th bgcolor="#666666" scope="col"> </th>
</tr>
Dat is nogal wat...
Met css doen we het zo:
Code:
html {
height: 100%;
padding-bottom: 1px;
background: #FFE4B9;
}
body {
width: 980px;
margin: 0 auto;
font-size: 100.1%;
}
#header {
padding: 10px;
background: #D5EDB3;
border: 10px solid #666666;
}
#logo {
margin: 0 22px;
}
Als je dan de twee wapentjes inbouwt in de logo-afbeelding, dan hoeft er in de html alleen maar te staan:
HTML:
<div id="header">
<img src="images/3fotos-logo-links.gif" width="188" height="110" alt="" />
<img id="logo" src="images/kasteel-olsene-logo.gif" width="520" height="110" alt="" />
<img src="images/3fotos-logo-links.gif" width="188" height="110" alt="" />
</div>
Zo gaat het altijd goed in elk browser.
Zes regeltjes zoete koek in plaats van die hele tros zure tabel-druiven! :d
Als je een pagina op deze manier opbouwt, is het laten vollopen met tekst geen enkel probleem. En als je later eens wat wilt veranderen, zie je in de broncode zó, waar je wezen moet.
- Als je toch de site aan het reorganiseren bent, zou ik het meteen goed doen. Dan heb je ook wat voor de toekomst. Anders moet het later wellicht overnieuw.
De hamvraag: wat moet je als startend webbouwer weten om dit zo te kunnen? In
het bookmark-topic gaf ik al de html+css cursus van web-garden.be door, en een vervolg-pil voor als je honger niet te stillen is.
Maar ik zal kijken of ik binnenkort wat concrete tips voor de pagina "geschiedenis" kan geven.
Wordt vervolgd!
Met vriendelijke groet,
CSShunter
verschijnt er dan een blauwe vervelende lijn rond de foto die aangeeft dat er een link gelegd is. Hoe kan ik die wegkrijgen of onzichtbaar maken met behoud van de link? Moest je me dat nog kunnen uitleggen kan ik verderbouwen aan de website. Alvast bedankt hé! 
