Black Friday = Pricewatch Bekijk onze selectie van de beste Black Friday-deals en voorkom een miskoop.
Toon posts:

[HTML] ]IE- veranderd layout bij expanden

Pagina: 1
Acties:

Verwijderd

Topicstarter
Goede-morgen inmiddels voor velen, tot aan frustratie toe al enige tijd bezig met het proberen te verhelpen van een probleem van een website.
Site zonder spelend probleem
Hier zijn verder nog geen problemen
Het probleem komt naar voren als er meer tekst inkomt dan in de contextbox past, dus deze gaat automatisch uitbreiden:
Expande pagina met spelend probleem
Echter heb ik dit probleem alleen met IE+Firefox, in dreamweaver (edit mode niet preview) en google chrome niet
Print screen google chrome
De site heb ik grafisch gemaakt in photoshop, daarna gesliced in PS en verder bewerkt met Dreamweaver.
De site bestaat dus feitelijk uit een tabel/kolommen.
Op het allereerste plaatje heb ik aangegeven hoe ik deze heb opgedeeld.. De menu's als volgt dus:
Plaatje(header bijv van''links'')
Background image in ''cel''<-- deze hoort mee te expanden gebeurd ook bij alle andere menus.
Foot image( bijv ook weer van ''links'')

Lijkt er dus op dat er iets misgaat bij de borders van de cellen, zal iig de code mee proberen in te plakken mocht deze nodig zijn.
Uitgerokken]
code:
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
<html>
<head>
<title>prowebsiteavans-lastone</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body,td,th {
    font-family: sans-serif;
    font-size: 14px;
}
-->
</style></head>
<body bgcolor="#FFFFFF" background="images/Grijs-left.gif" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div align="center"> 
  <table id="Table_01" width="1025" height="768" border="0" cellpadding="0" cellspacing="0">
    <tr> 
      <td rowspan="11"> <img src="images/Grijs-left.gif" width="57" height="768" alt=""></td>
      <td colspan="3"> <img src="images/banner.gif" alt="" width="918" height="194" border="0" usemap="#Map"></td>
      <td rowspan="11"> <img src="images/Grijs-right.gif" width="49" height="768" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="194" alt=""></td>
    </tr>
    <tr> 
      <td> <img src="images/topmenu.gif" width="190" height="24" alt=""></td>
      <td> <img src="images/topcontent.gif" width="504" height="24" alt=""></td>
      <td> <img src="images/top-newsflash.gif" width="224" height="24" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="24" alt=""></td>
    </tr>
    <tr> 
      <td valign="top" background="images/middlemenu.gif">&nbsp; </td>
      <td rowspan="7" valign="top" background="images/middlecontent.gif"><p align="center"><strong>Wat kun je ermee  worden?</strong></p>
        <p>&nbsp;Een  typische functie die een BI&rsquo;er na het behalen van zijn diploma kan &nbsp;uitoefenen  is die van een <strong>informatieanalist</strong>.<br>
          &nbsp;Vraag is  dan natuurlijk wat een informatieanalist doet.<br>
          &nbsp;Een  informatieanalist bekijkt de bedrijfsprocessen binnen een bedrijf. Dit houdt &nbsp;in dat hij kijkt naar wat voor  activiteiten er allemaal plaats vinden binnen een &nbsp;bedrijf. Als deze in beeld  zijn gebracht gaat hij kijken naar wat er verbeterd kan &nbsp;worden aan deze  activiteiten, deze verbeteringen worden bijna altijd bereikt &nbsp;door middel van  automatisering. <br>
  &nbsp;De informatieanalist heeft de organisatie  nodig om te kijken hoe de processen &nbsp;nu lopen en vervolgens te bepalen of  deze verbeterd kan worden. <br>
  &nbsp;Het is soms ook niet helemaal duidelijk wat  een organisatie wil, een &nbsp;informatieanalist moet&nbsp;  door effectief te communiceren in kaart kunnen brengen &nbsp;wat een  organisatie wil. Ook moet hij de organisatie helpen met de &nbsp;verbeteringen die  worden doorgevoerd, dit houdt meestal in dat hij de &nbsp;eindgebruikers&nbsp; moet opleiden om met de verbeterde  bedrijfsprocessen te &nbsp;werken. Dit is niet altijd even makkelijk voor  iedereen. Natuurlijk moet de  &nbsp;informatiespecialist kennis hebben van ICT en automatisering, zo is hij in  staat &nbsp;om een bedrijf een advies te geven over te verbeteren bedrijfsprocessen. </p>
        <p>&nbsp;Een  andere functie is de <strong>E-business  specialist</strong>.<br>
          &nbsp;Deze  functie heeft&nbsp;veel met Internet te maken.&nbsp; Internet wordt steeds meer  &nbsp;toegepast in onze samenleving, denk alleen maar aan de hoeveelheid  &nbsp;internetwinkels waar je zelf waarschijnlijk ook veel gebruik van maakt. Of denk  &nbsp;aan de mobiele telefoons van tegenwoordig, deze bevatten ook steeds meer &nbsp;aan  internet gerelateerde gadgets. Om dit alles mogelijk te maken zijn er &nbsp;projecten  nodig om dit tot stand te brengen. Een E-business specialist is &nbsp;iemand die  werkt aan deze <strong><em>E-business-projecten</em></strong>.<br>
          &nbsp;Een  E-business specialist doet onderzoek en analyseert alle processen die &nbsp;hierbij  komen kijken. Dit kan vari&euml;ren van de inkoop van de producten, de &nbsp;logistiek  hiervan en de uiteindelijke factuur die je krijgt als je bijvoorbeeld&nbsp; bij &nbsp;Bol.com iets besteld. Deze processen  lopen door heel de organisatie.<br>
          &nbsp;Daarna ga  je aan oplossingen werken om dit alles nog effici&euml;nter te laten &nbsp;verlopen.  Hierbij communiceer je bijvoorbeeld met mensen van Bol.com maar &nbsp;ook met  programmeurs die de website gaan verbeteren. Dit zijn mensen die &nbsp;bijvoorbeeld  Informatica of Technische Informatica gestudeerd hebben, hier &nbsp;moet je dus ook  op technisch niveau mee kunnen communiceren. Dit alles &nbsp;moet meestal binnen een bepaalde tijd gebeuren dus heb je een  goed plan &nbsp;van aanpak(inclusief planning) en een implementatieplan nodig&nbsp; die ook &nbsp;uitvoerbaar moet zijn. Ook moet er getest worden of de site  werkelijk beter is &nbsp;geworden. Dit alles valt onder de verantwoordelijkheid van  de E-business &nbsp;specialist. Door de steeds snellere ontwikkelingen op internet  gebied blijft dit &nbsp;een leuke en uitdagende functie.</p>        
        <p align="center">&nbsp;</p>
      </td>
      <td rowspan="4" valign="top" background="images/middle-newsflash.gif">&nbsp; </td>
      <td> <img src="images/spacer.gif" width="1" height="124" alt=""></td>
    </tr>
    <tr> 
      <td> <img src="images/bottom-newsflash.gif" width="190" height="11" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="11" alt=""></td>
    </tr>
    <tr> 
      <td> <img src="images/top-links.gif" width="190" height="20" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="20" alt=""></td>
    </tr>
    <tr> 
      <td rowspan="4" valign="top" background="images/middle-links.gif">&nbsp; </td>
      <td> <img src="images/spacer.gif" width="1" height="89" alt=""></td>
    </tr>
    <tr> 
      <td> <img src="images/bottomw-newslfash.gif" width="224" height="9" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="9" alt=""></td>
    </tr>
    <tr> 
      <td> <img src="images/top-fotos.gif" width="224" height="22" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="22" alt=""></td>
    </tr>
    <tr> 
      <td valign="top" background="images/middle-fotos.gif">&nbsp; </td>
      <td> <img src="images/spacer.gif" width="1" height="246" alt=""></td>
    </tr>
    <tr> 
      <td> <img src="images/middle-links-17.gif" width="190" height="9" alt=""></td>
      <td> <img src="images/content-bottom.gif" width="504" height="9" alt=""></td>
      <td> <img src="images/bottom-fotos.gif" width="224" height="9" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="9" alt=""></td>
    </tr>
    <tr> 
      <td colspan="3"> <img src="images/footer.gif" alt="" width="918" height="20" border="0" usemap="#Map2"></td>
      <td> <img src="images/spacer.gif" width="1" height="20" alt=""></td>
    </tr>
  </table>
  
</div>
<map name="Map">
  <area shape="rect" coords="250,23,300,42" href="#">
  <area shape="rect" coords="847,23,898,41" href="#">
  <area shape="rect" coords="345,10,565,49" href="#">
  <area shape="rect" coords="28,60,316,79" href="#">
  <area shape="rect" coords="383,59,511,78" href="#">
  <area shape="rect" coords="657,58,891,80" href="#">
</map>
<map name="Map2">
  <area shape="rect" coords="23,1,893,19" href="#">
</map>
</body>
</html>


NIET uitgerokken (zonder tekst)
code:
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
<html>
<head>
<title>prowebsiteavans-lastone</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" background="images/Grijs-left.gif" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div align="center"> 
  <table id="Table_01" width="1025" height="768" border="0" cellpadding="0" cellspacing="0">
    <tr> 
      <td rowspan="11"> <img src="images/Grijs-left.gif" width="57" height="768" alt=""></td>
      <td colspan="3"> <img src="images/banner.gif" alt="" width="918" height="194" border="0" usemap="#Map"></td>
      <td rowspan="11"> <img src="images/Grijs-right.gif" width="49" height="768" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="194" alt=""></td>
    </tr>
    <tr> 
      <td> <img src="images/topmenu.gif" width="190" height="24" alt=""></td>
      <td> <img src="images/topcontent.gif" width="504" height="24" alt=""></td>
      <td> <img src="images/top-newsflash.gif" width="224" height="24" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="24" alt=""></td>
    </tr>
    <tr> 
      <td valign="top" background="images/middlemenu.gif">&nbsp; </td>
      <td rowspan="7" valign="top" background="images/middlecontent.gif">&nbsp; </td>
      <td rowspan="4" valign="top" background="images/middle-newsflash.gif">&nbsp; </td>
      <td> <img src="images/spacer.gif" width="1" height="124" alt=""></td>
    </tr>
    <tr> 
      <td> <img src="images/bottom-newsflash.gif" width="190" height="11" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="11" alt=""></td>
    </tr>
    <tr> 
      <td> <img src="images/top-links.gif" width="190" height="20" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="20" alt=""></td>
    </tr>
    <tr> 
      <td rowspan="4" valign="top" background="images/middle-links.gif">&nbsp; </td>
      <td> <img src="images/spacer.gif" width="1" height="89" alt=""></td>
    </tr>
    <tr> 
      <td> <img src="images/bottomw-newslfash.gif" width="224" height="9" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="9" alt=""></td>
    </tr>
    <tr> 
      <td> <img src="images/top-fotos.gif" width="224" height="22" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="22" alt=""></td>
    </tr>
    <tr> 
      <td valign="top" background="images/middle-fotos.gif">&nbsp; </td>
      <td> <img src="images/spacer.gif" width="1" height="246" alt=""></td>
    </tr>
    <tr> 
      <td> <img src="images/middle-links-17.gif" width="190" height="9" alt=""></td>
      <td> <img src="images/content-bottom.gif" width="504" height="9" alt=""></td>
      <td> <img src="images/bottom-fotos.gif" width="224" height="9" alt=""></td>
      <td> <img src="images/spacer.gif" width="1" height="9" alt=""></td>
    </tr>
    <tr> 
      <td colspan="3"> <img src="images/footer.gif" alt="" width="918" height="20" border="0" usemap="#Map2"></td>
      <td> <img src="images/spacer.gif" width="1" height="20" alt=""></td>
    </tr>
  </table>
  
</div>
<map name="Map">
  <area shape="rect" coords="250,23,300,42" href="#">
  <area shape="rect" coords="847,23,898,41" href="#">
  <area shape="rect" coords="345,10,565,49" href="#">
  <area shape="rect" coords="28,60,316,79" href="#">
  <area shape="rect" coords="383,59,511,78" href="#">
  <area shape="rect" coords="657,58,891,80" href="#">
</map>
<map name="Map2">
  <area shape="rect" coords="23,1,893,19" href="#">
</map>
</body>
</html>



Heb inmiddels al meerdere malen het opnieuw proberen te slicen en onder te verdelen maar kom steeds terug bij dezelfde problemen, standaard research via google leverde me ook weinig op dus dan hopen via deze weg.

Alvast bedankt voor enige hulp / informatieverstrekking

Verwijderd

dit soort fouten kun je vaak voorkomen door vanaf het begin al sites w3valid te maken, ze moeten dan door deze test heenkomen:

validator.w3.org

dreamweaver houd zich zelf zoveel mogelijk aan deze standaarden, moet jij dat ook doen natuurlijk.

ik zie zo 123 ff niet het probleem maar ik denk dat je dit probleem niet hebt als je met divjes gaat werken.

  • TeeDee
  • Registratie: Februari 2001
  • Laatst online: 21:49

TeeDee

CQB 241

Nog makkelijker voor ons is als je een testcase online zet.

Heart..pumps blood.Has nothing to do with emotion! Bored


  • BlackWhizz
  • Registratie: September 2004
  • Laatst online: 08-12-2024
Je moet op tussen td's een line-height en fotn-size van 1px zetten en overflow: hidden.

Verwijderd

Topicstarter
TeeDee schreef op zaterdag 18 oktober 2008 @ 12:00:
Nog makkelijker voor ons is als je een testcase online zet.
TestcaseHeb hem net geupload, even kort de 2 pagina's aan elkaar gelinkt zodat het verschil duidelijk is.
BlackWhizz schreef op zaterdag 18 oktober 2008 @ 12:03:
Je moet op tussen td's een line-height en fotn-size van 1px zetten en overflow: hidden.
Zal dit als handvatten gebruiken en hier wat verder naar zoeken / mee spelen dan, mits je overtuigt bent dat het hiermee echt opgelost is?

Hopelijk geeft de testcaste dus wat meer duidelijkheid

  • Borizz
  • Registratie: Maart 2005
  • Laatst online: 24-09 20:59
Los van het feit dat ik het probleem niet kan reproduceren in je testcase, zou je eens op internet kunnen zoeken hoe men tegenwoordig websites bouwt. Het probleem ontstaat waarschijnlijk ook doordat je gebruik maakt van tabellen (en de daarmee gepaard gaande padding, cellpadding, cellspacing etc). Het zou ook te maken kunnen hebben met de vertical-align CSS property op je afbeeldingen in de tabellen..

En offtopic:
Ik weet dat je opdracht voor school ongeveer zo luid:
Maak een informatieve website voor je opleiding, zodat bezoekers kunnen zien welke kanten je op kan met de opleiding. (En omdat je zelf ook net begonnen bent met de opleiding leer je de opleiding zo ook al beter kennen).
Maar de site trekt niet echt bezoekers aan denk ik, hij ziet er nogal grauw uit. Ik zou zeggen zoek eens wat meer artikelen op over webdesign en semantische html. Daar kan je tenminste mee aankomen op een informatica opleiding..

If I can't fix it, it ain't broken.

Pagina: 1