[website] witmarge te groot - Softwareontwikkeling

zondag 13 juni 2004 17:29

Acties:

Verwijderd

Topicstarter

Ik ben bezig met een website voor een schoonheidsinstituut. De website bestaat tot nu toe uit 4 div's en 2 tabellen:

code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>ccvison default</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="include/ccvision_stylesheet.css" rel="stylesheet" type="text/css" />
<script language="javaScript" src="./include/ccvision_scripts.js" type="text/javascript"></script>

</head>

<body>

<div id="box">

    <div id="header">

        <table width="760" height="147" border="0" cellpadding="0" cellspacing="0">
          <tr>
            <td width="760" height="120" align="left" valign="top">
                [img]"./img/header.jpg"[/img]
                <map name="m_header">
                <area shape="poly" coords="5,30,128,30,128,120,5,120,5,30" href="index.htm" alt="Home" >
                </map>
            </td>
          </tr>
          <tr>
            <td width="760" height="22" align="left" valign="top">
            <table border="0" cellpadding="0" cellspacing="0" width="760">
  <tr>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
  </tr>
  <tr>
   <td colspan="15">[img]"./img/menu/menu_r1_c1.jpg"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
  </tr>
  <tr>
   <td rowspan="4">[img]"./img/menu/menu_r2_c1.jpg"[/img]</td>
   <td rowspan="3"><a href="#" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('menu_r2_c2','','./img/menu/menu_r2_c2_f2.jpg',1);">[img]"./img/menu/menu_r2_c2.jpg"[/img]</a></td>
   <td rowspan="4">[img]"./img/menu/menu_r2_c3.jpg"[/img]</td>
   <td rowspan="3"><a href="#" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('menu_r2_c4','','./img/menu/menu_r2_c4_f2.jpg',1);">[img]"./img/menu/menu_r2_c4.jpg"[/img]</a></td>
   <td rowspan="4">[img]"./img/menu/menu_r2_c5.jpg"[/img]</td>
   <td rowspan="3"><a href="#" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('menu_r2_c6','','./img/menu/menu_r2_c6_f2.jpg',1);">[img]"./img/menu/menu_r2_c6.jpg"[/img]</a></td>
   <td rowspan="4">[img]"./img/menu/menu_r2_c7.jpg"[/img]</td>
   <td rowspan="3"><a href="#" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('menu_r2_c8','','./img/menu/menu_r2_c8_f2.jpg',1);">[img]"./img/menu/menu_r2_c8.jpg"[/img]</a></td>
   <td rowspan="4">[img]"./img/menu/menu_r2_c9.jpg"[/img]</td>
   <td rowspan="3"><a href="#" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('menu_r2_c10','','./img/menu/menu_r2_c10_f2.jpg',1);">[img]"./img/menu/menu_r2_c10.jpg"[/img]</a></td>
   <td rowspan="4">[img]"./img/menu/menu_r2_c11.jpg"[/img]</td>
   <td rowspan="3"><a href="#" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('menu_r2_c12','','./img/menu/menu_r2_c12_f2.jpg',1);">[img]"./img/menu/menu_r2_c12.jpg"[/img]</a></td>
   <td colspan="3">[img]"./img/menu/menu_r2_c13.jpg"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
  </tr>
  <tr>
   <td rowspan="3">[img]"./img/menu/menu_r3_c13.jpg"[/img]</td>
   <td><a href="#" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('menu_r3_c14','','./img/menu/menu_r3_c14_f2.jpg',1);">[img]"./img/menu/menu_r3_c14.jpg"[/img]</a></td>
   <td rowspan="3">[img]"./img/menu/menu_r3_c15.jpg"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
  </tr>
  <tr>
   <td rowspan="2">[img]"./img/menu/menu_r4_c14.jpg"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
  </tr>
  <tr>
   <td>[img]"./img/menu/menu_r5_c2.jpg"[/img]</td>
   <td>[img]"./img/menu/menu_r5_c4.jpg"[/img]</td>
   <td>[img]"./img/menu/menu_r5_c6.jpg"[/img]</td>
   <td>[img]"./img/menu/menu_r5_c8.jpg"[/img]</td>
   <td>[img]"./img/menu/menu_r5_c10.jpg"[/img]</td>
   <td>[img]"./img/menu/menu_r5_c12.jpg"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
  </tr>
</table>
            </td>
          </tr>
        </table>
            
  </div>
    
    <div id="content">content</div>
    <div id="footer">footer</div>
</div>

</body>
</html>

de header en het menu staan in dezelfde div (header) en staan in een tabel. de witruimte tussen de header en het menu is te groot, terwijl ik volgens mij de juiste afmetingen heb meegegeven.

bekijk het probleem:
http://www.digitalminds.nl/ccvision/index.htm

iemand een idee hoe het probleem op te lossen?

zondag 13 juni 2004 17:40

Acties:

Superdeboer

Sa-weee-tah

Probeer:

HTML:

20	<img name="header" src="./img/header.jpg" width="760" height="125" border="0" usemap="#m_header" alt="Schoonheidsinstituut C.C. Vision">

eens te veranderen in

HTML:

20	<img name="header" src="./img/header.jpg" width="760" height="125" border="0" usemap="#m_header" alt="Schoonheidsinstituut C.C. Vision" style="display: block;">

edit:
Werkt niet zie ik al...

[ Voor 5% gewijzigd door Superdeboer op 13-06-2004 17:44 ]

When I write my code, only God and I know what it means. One week later, only God knows.
Hell yes it's a Cuban Cigar, but I'm not supporting their economy, I'm burning their fields.

zondag 13 juni 2004 18:13

Acties:

Superdeboer

Sa-weee-tah

Dit is het:

HTML:

<tr>
   <td><img src="./img/menu/spacer.gif" width="164" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="55" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="6" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="89" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="7" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="67" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="6" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="64" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="6" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="46" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="7" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="37" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="7" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="44" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="155" height="1" border="0" alt=""></td>
   <td><img src="./img/menu/spacer.gif" width="1" height="1" border="0" alt=""></td>
</tr>

Dat kan er helemaal uit en dan ziet 't er denk ik precies zo uit als jij wilt.

offtopic:
Overigens klopt je doctype niet, of je hebt je daar niet aan gehouden.

Het is momenteel niet XHTML 1.0 valid. Daarvoor zul je in ieder geval de height-attributen uit de table-tags moeten laten vervallen. Ook moet je de img-tags afsluiten.
HTML 4.01 Transitional valideert overigens ook niet helemaal; daar moet je dus misschien nog wel even naar kijken.

When I write my code, only God and I know what it means. One week later, only God knows.
Hell yes it's a Cuban Cigar, but I'm not supporting their economy, I'm burning their fields.

zondag 13 juni 2004 18:23

Acties:

Verwijderd

Ik denk je die website makkelijk een stuk kleiner kunt krijgen als je een beetje gaat structureren in plaats van met dreamweaver spelen.

zondag 13 juni 2004 18:56

Acties:

Verwijderd

Topicstarter

Superdeboer schreef op 13 juni 2004 @ 18:13:
Dit is het:
HTML:
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<tr>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
   <td>[img]"./img/menu/spacer.gif"[/img]</td>
</tr>
Dat kan er helemaal uit en dan ziet 't er denk ik precies zo uit als jij wilt.

offtopic:
Overigens klopt je doctype niet, of je hebt je daar niet aan gehouden.
Het is momenteel niet XHTML 1.0 valid. Daarvoor zul je in ieder geval de height-attributen uit de table-tags moeten laten vervallen. Ook moet je de img-tags afsluiten.
HTML 4.01 Transitional valideert overigens ook niet helemaal; daar moet je dus misschien nog wel even naar kijken.

idd dat gedeelte kon er helemaal uit, er is nu trouwens nog niet veel veranderd, die witregel mag maar 1px hoog zijn. verder zal ik me eens gaan verdiepen en die validaties.

zondag 13 juni 2004 19:20

Acties:

Thijsmans

⭐⭐⭐⭐⭐ (5/5)

Als je toch aan de slag gaat, gebruik dan geen tables

Tables zijn gemaakt om gestructureerd informatie weer te geven, niet voor opmaak van complete sites

Zie ook www.w3schools.org css2 voor specs.

Privacy-adepten vinden op AVGtekst.nl de Nederlandse AVG-tekst voorzien van uitspraken en besluiten.

zondag 13 juni 2004 19:28

Acties:

Superdeboer

Sa-weee-tah

Verwijderd schreef op 13 juni 2004 @ 18:56:
[...]
er is nu trouwens nog niet veel veranderd, die witregel mag maar 1px hoog zijn.

Ik heb het hier lokaal uitgeprobeerd en in zowel IE, als FireFox was die witregel vervolgens maar 1px hoog...

Op http://www.digitalminds.nl/ccvision/index.htm is het toch ook nog niet aangepast?

edit:
In FireFox is het dus wel goed... In IE nog niet. Om dat goed te krijgen zul je ook moeten toepassen wat ik hier gezegd heb. Je moet dus én dat style-attribuut toevoegen aan die headerimage én die tablerow met die spacers eruit slopen.

[ Voor 32% gewijzigd door Superdeboer op 13-06-2004 19:34 ]

When I write my code, only God and I know what it means. One week later, only God knows.
Hell yes it's a Cuban Cigar, but I'm not supporting their economy, I'm burning their fields.

zondag 13 juni 2004 21:13

Acties:

Verwijderd

Topicstarter

aangepast, upgeload, en verrek het werkt. hartstikke bedankt voor de reacties!

Pagina: 1

Reageer