Check alle échte Black Friday-deals Ook zo moe van nepaanbiedingen? Wij laten alleen échte deals zien

[CSS / IE] Verschil in weergave tussen IE6 en IE7

Pagina: 1
Acties:

  • jwkempeneers
  • Registratie: September 2007
  • Laatst online: 19-05-2019
Ik ben bezig met het bouwen van mijn website, maar ik loop tegen een probleempje aan. De tekst op de pagina's van mijn website http://www.kempeneersmultimedia.nl/test passen precies op de standaardgrootte van de pagina. Behalve de portfoliopagina. Het is de bedoeling dat het middelste witte gedeelte gewoon langer wordt, zodat alles erin past, en de footer dus naar beneden verschuift. Nu gaat dit met mijn huidige script wel goed in IE6, maar niet in IE7. Daar loopt de footer over de tekst heen. Ook in FF wordt dit zo weergegeven. Wie kan mij hierbij helpen? Ik heb al van alles geprobeerd, maar ik kom er echt niet uit.

Hieronder mijn scripts van de CSS en de Portfoliopagina.

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
body {
    font-family:Verdana;
    font-size:12px;
    color:#00074f;
    background-image:url(images/bgcolor.jpg)
}

#container {
    border:2px solid #3c9dd0;
    margin-left:auto;
    margin-right:auto;
    width:800px;
}

#kop {
    position:relative;
    height:173px;
    background-image:url("images/header.jpg");
}

#inhoud {
    padding-left:20px;
    text-align:justify;
    position:relative;
    height:503px;
}

#tekst {
    float:left;
    position:relative;
    height:503px;
    width: 550px;
}

#tekst_portfolio {
    float:left;
    position:relative;
    height:425px;
    width: 550px;
}

#menu {
    float:right;
    position:relative;
    height:503px;
    width:140px;
}

#footer {
    padding-left:20px;
    position:relative;
    height:90px;
    background-image:url("images/footer.jpg");
}

a:link {
    color:#000000;
    text-decoration:none;
}

a:active {
    color:#000000;
    text-decoration:underline;
}

a:visited {
    color:#000000;
    text-decoration:none;
}

a:hover {
    color:#000000;
    text-decoration:underline;
}

img {
    border:0;
}


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
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <title>Kempeneers Multimedia</title>

        <script type="text/javascript" src="js/prototype.js"></script>
        <script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
        <script type="text/javascript" src="js/lightbox.js"></script>

        <link rel="stylesheet"  href="style.css" type="text/css" />
        <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
        <meta http-equiv="imagetoolbar" content="no">
    </head>
    
    <body>

<div id="container">
    <div id="kop"></div>
    
    <div id="inhoud">

    <br /><br /><br /><br />
   
    <div id="tekst_portfolio">

<font style="font-weight:Verdana; font-size:18px; color:#379bcf;">Portfolio</font>
<br /><br />

<table width="100%" border="0">
<tr>
<td>
In de achterliggende tijd hebben wij onder andere de websites voor onderstaande verenigingen en bedrijven gerealiseerd. Uw website ook hierbij? Neem dan contact op met ons voor een uitgebreid advies over het laten bouwen van uw website.

<br /><br /><br />
<center>
<table width="500px" border="1" bordercolor="#379bcf">
<tr>
<td>
<table border="0">
    <tr> 
        <td width="20px">
        </td>
        <td width="175px">
        <br />
        <a href="./images/siteeffective.jpg" rel="lightbox[roadtrip]"><img src="./images/siteeffective_small.jpg" style="border: solid 1px #379bcf;"></a>
        <br />
        </td> 
        <td width="20px">
        </td>
        <td width="305px">
        <a style="color: #00074f;"  a href="http://www.effective-vof.com" target="blank"><b>Effective VOF</b></a>
        <br /><br />
        <a style="color: #00074f;"  a href="http://www.effective-vof.com" target="blank">www.effective-vof.com</a>
        </td>
        <td width="20px">
        </td>
        </tr>
</table>
</td>
</tr>
</table>
<br /><br />
<table width="500px" border="1" bordercolor="#379bcf">
<tr>
<td>
<table border="0">
    <tr> 
        <td width="20px">
        </td>
        <td width="175px">
        <br />
        <a href="./images/sitebrandweer.jpg" rel="lightbox[roadtrip]"><img src="./images/sitebrandweer_small.jpg" style="border: solid 1px #379bcf;"></a>
        <br />
        </td> 
        <td width="20px">
        </td>
        <td width="305px">
        <a style="color: #00074f;"  a href="http://www.brandweer-sintphilipsland.nl" target="blank"><b>Brandweer Sint Philipsland</b></a>
        <br /><br />
        <a style="color: #00074f;"  a href="http://www.brandweer-sintphilipsland.nl" target="blank">www.brandweer-sintphilipsland.nl</a>
        </td>
        <td width="20px">
        </td>
        </tr>
</table>
</td>
</tr>
</table>
<br /><br />
<table width="500px" border="1" bordercolor="#379bcf">
<tr>
<td>
<table border="0">
    <tr> 
        <td width="20px">
        </td>
        <td width="175px">
        <br />
        <a href="./images/siteheemkunde.jpg" rel="lightbox[roadtrip]"><img src="./images/siteheemkunde_small.jpg" style="border: solid 1px #379bcf;"></a>
        <br />
        </td> 
        <td width="20px">
        </td>
        <td width="305px">
        <a style="color: #00074f;"  a href="http://www.sint-philipsland.nl" target="blank"><b>Heemkundekring Philippuslandt</b></a>
        <br /><br />
        <a style="color: #00074f;"  a href="http://www.sint-philipsland.nl" target="blank">www.sint-philipsland.nl</a>
        </td>
        <td width="20px">
        </td>
        </tr>
</table>
</td>
</tr>
</table>

</center>
</td>
</tr>
</table>
<br /><br />

    </div>
    
    <div id="menu">
    
    <a href="./index.php"><img src="./images/home.jpg" border="0"></a><br />
    <a href="./webdesign.php"><img src="./images/webdesign.jpg" border="0"></a><br />
    <a href="./fotografie.php"><img src="./images/fotografie.jpg" border="0"></a><br />
    <a href="./portfolio.php"><img src="./images/portfolio.jpg" border="0"></a><br />
    <a href="./contact.php"><img src="./images/contact.jpg" border="0"></a><br />
   
    </div>
    </div>

    <div id="footer">
    <br />
    <font face="Verdana" size="-2"><b>
    Wilhelminastraat 59 <br />
    4675 BS Sint Philipsland <br />
    T   +31 (0)622 597 790 <br />
    E   info@kempeneersmultimedia.nl <br />
    W   www.kempeneersmultimedia.nl
    </b></font>    </div>
</div>

<center>
<font face="Verdana" size="-3" color="#00074f">
All rights reserved - &copy; 2008 - <a style="color: #00074f;"  a href="http://www.kempeneersmultimedia.nl">Kempeneers Multimedia</a>
</font>
</center>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-3824231-1";
urchinTracker();
</script>
    </body>
</html>

  • Rekcor
  • Registratie: Februari 2005
  • Laatst online: 08-10 13:03
Waarom geef je je inhoud een vaste hoogte?

Cascading Stylesheet:
1
2
3
4
5
6
#inhoud {
    padding-left:20px;
    text-align:justify;
    position:relative;
    height:503px;
}


P.S. (Tabellen in) tabellen gebruiken voor de opmaak is m.i. een beetje...1990.

[ Voor 19% gewijzigd door Rekcor op 11-03-2008 15:10 ]


  • jwkempeneers
  • Registratie: September 2007
  • Laatst online: 19-05-2019
Rekcor schreef op dinsdag 11 maart 2008 @ 15:10:
Waarom geef je je inhoud een vaste hoogte?

Cascading Stylesheet:
1
2
3
4
5
6
#inhoud {
    padding-left:20px;
    text-align:justify;
    position:relative;
    height:503px;
}


P.S. (Tabellen in) tabellen gebruiken voor de opmaak is m.i. een beetje...1990.
Je hebt volgens mij inderdaad gelijk, want de div #tekst en de div #menu hebben al een hoogte dus dat is eigenlijk niet nodig?!

Ik heb even geprobeerd om die hoogte weg te halen, maar dan komt mijn footer ergens bij mijn menu te staan.

[ Voor 10% gewijzigd door jwkempeneers op 11-03-2008 15:14 ]


  • TeeDee
  • Registratie: Februari 2001
  • Laatst online: 16:28

TeeDee

CQB 241

Mjah, ik zou eerst eens zorgen dat je het e.e.a. opschoont.

Tables, inline styles, tag-soup en weet ik veel wat nog meer. Nu is het symptoom bestrijding.

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


  • jwkempeneers
  • Registratie: September 2007
  • Laatst online: 19-05-2019
TeeDee schreef op dinsdag 11 maart 2008 @ 15:42:
Mjah, ik zou eerst eens zorgen dat je het e.e.a. opschoont.

Tables, inline styles, tag-soup en weet ik veel wat nog meer. Nu is het symptoom bestrijding.
Ik heb nu ff de tabellen eruit gegooid en vervangen door platte tekst, zodat het wat overzichtelijker wordt. Het weergave probleem blijft echter hetzelfde. Wat te doen?

Hieronder de nieuwe code:

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <title>Kempeneers Multimedia</title>

        <script type="text/javascript" src="js/prototype.js"></script>
        <script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
        <script type="text/javascript" src="js/lightbox.js"></script>

        <link rel="stylesheet"  href="style.css" type="text/css" />
        <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
        <meta http-equiv="imagetoolbar" content="no">
    </head>
    
    <body>

<div id="container">
    <div id="kop"></div>
    
    <div id="inhoud">

    <br /><br /><br /><br />
   
    <div id="tekst_portfolio">

<font style="font-weight:Verdana; font-size:18px; color:#379bcf;">Portfolio</font>
<br /><br />

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas blandit felis id felis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Fusce quam turpis, sagittis nec, pellentesque sit amet, ullamcorper vel, augue. Integer hendrerit ultricies dolor. Nullam tristique. Morbi nonummy. Curabitur sed est. Donec lectus. Aenean metus. Pellentesque est. Aliquam ac justo sed lorem facilisis hendrerit. Suspendisse a lectus. 
<br /><br />
Donec adipiscing, arcu in euismod fermentum, odio augue rutrum ligula, eu interdum lorem arcu in purus. Aliquam et arcu. Proin id ipsum et ipsum feugiat adipiscing. Fusce rutrum purus non justo. Ut eu ante. Nullam sagittis. Morbi odio lectus, elementum ut, malesuada in, faucibus eget, neque. In hac habitasse platea dictumst. In euismod. Cras neque orci, imperdiet quis, dignissim vitae, semper ut, massa. Donec sapien dolor, congue quis, malesuada vitae, faucibus sit amet, turpis. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
<br /><br />
Morbi id felis. In tempus posuere sapien. Proin mauris libero, consequat in, lobortis sed, viverra a, sem. In arcu. Aliquam at mi. Proin auctor. Nullam hendrerit quam ut massa. Curabitur nonummy volutpat lacus. Integer eleifend. Integer ut elit rutrum ipsum porta condimentum. 
<br /><br />
Pellentesque eros nisl, aliquet sit amet, ullamcorper in, luctus id, magna. Nam tincidunt odio vitae risus. Nunc sapien. Suspendisse at felis ut neque congue rhoncus. Proin risus. Nullam scelerisque lacus sit amet lacus. Sed feugiat libero et ipsum. Mauris nonummy massa ut arcu. Duis mattis, odio ut sollicitudin sollicitudin, enim felis vulputate sapien, at lobortis nunc ipsum at velit. Donec facilisis, massa non egestas rutrum, elit mauris cursus justo, id consequat lectus tortor elementum nunc. Cras porttitor dolor at lorem. In ac nulla. 
<br /><br />
Fusce eu ante. Nunc eget nisl. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Integer sit amet metus. Donec nisi enim, sagittis eget, vestibulum laoreet, venenatis id, urna. Nam mollis risus quis neque. Quisque non mi eu ligula volutpat blandit. In tincidunt lorem. Quisque auctor, tortor vitae interdum sodales, risus pede convallis massa, id facilisis lacus mauris sit amet lectus. In purus leo, placerat sit amet, pellentesque in, blandit id, lacus. Cras semper sagittis leo. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Mauris cursus pellentesque nulla. Cras tempor facilisis lectus. Nullam consectetuer. Morbi laoreet, ligula id elementum laoreet, est felis bibendum dolor, nec aliquam pede metus sit amet tortor. Morbi eget velit. 
<br /><br />
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus scelerisque diam vel eros. Pellentesque vestibulum adipiscing nisi. Vivamus lobortis tortor. Sed mauris. Etiam nunc ligula, luctus elementum, adipiscing vitae, tempor eu, quam. Suspendisse odio. Praesent vel dolor quis leo tincidunt elementum. Integer aliquam dui eu leo. In aliquet, erat sed nonummy condimentum, mauris urna hendrerit enim, a posuere nulla ipsum id leo. Nullam augue. Pellentesque gravida placerat dui. Duis laoreet. Vestibulum adipiscing scelerisque dolor. Nulla facilisi. Donec eget urna. Nulla eros. Cras dapibus, sapien a ultricies fermentum, pede risus hendrerit nisi, vitae tristique massa ipsum eget enim. Duis facilisis erat nec ante. Vivamus quis lectus nec est sodales egestas. 
<br /><br />
Etiam feugiat eleifend justo. Quisque ut lacus sodales dolor consequat ornare. Nunc sodales neque gravida magna. Ut faucibus diam eget massa. Nam elementum. Sed feugiat eros eu odio. Morbi quis nisi quis augue molestie pretium. Maecenas mollis, turpis ut commodo aliquam, ipsum nibh sagittis odio, in malesuada tortor libero at magna. Integer libero. Nulla quis odio. Donec nonummy, turpis eget laoreet aliquam, libero orci blandit tortor, at luctus quam mauris ut urna. 
<br /><br />
Donec sed ligula. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Etiam libero. Vivamus a sem. Praesent venenatis lectus eu odio. Donec faucibus erat nec nisi. Mauris aliquam, elit id eleifend blandit, lorem orci sodales sapien, et sodales nunc eros ac leo. Aliquam dapibus leo a est. Pellentesque mollis mollis enim. Nulla dapibus cursus erat. Nam quis sem. Duis sapien. Phasellus non tortor at orci sollicitudin pellentesque. Maecenas posuere luctus lacus. Proin iaculis rhoncus ante. 
<br /><br />
In vehicula. Etiam molestie turpis sed lectus. Nullam id elit vel metus pretium scelerisque. Donec porttitor, urna imperdiet commodo convallis, erat lectus placerat leo, sed gravida justo odio sed ipsum. Quisque interdum porttitor quam. Vestibulum nulla erat, vulputate sed, congue a, consectetuer vel, nisl. Donec feugiat tellus sit amet nisl. Sed tempus. In eleifend leo et erat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras eleifend, leo at tempus vehicula, lectus ante suscipit nulla, rhoncus porta urna erat a nibh. Fusce sed risus. Maecenas erat. Aenean auctor volutpat leo. Pellentesque nibh ligula, pharetra eu, varius eget, dignissim sed, risus. Donec tellus felis, porttitor non, blandit sed, consequat ac, nisl. 

<br /><br />

    </div>
    
    <div id="menu">
    
    <a href="./index.php"><img src="./images/home.jpg" border="0"></a><br />
    <a href="./webdesign.php"><img src="./images/webdesign.jpg" border="0"></a><br />
    <a href="./fotografie.php"><img src="./images/fotografie.jpg" border="0"></a><br />
    <a href="./portfolio.php"><img src="./images/portfolio.jpg" border="0"></a><br />
    <a href="./contact.php"><img src="./images/contact.jpg" border="0"></a><br />
   
    </div>
    </div>

    <div id="footer">
    <br />
    <font face="Verdana" size="-2"><b>
    Wilhelminastraat 59 <br />
    4675 BS Sint Philipsland <br />
    T   +31 (0)622 597 790 <br />
    E   info@kempeneersmultimedia.nl <br />
    W   www.kempeneersmultimedia.nl
    </b></font>    </div>
</div>

<center>
<font face="Verdana" size="-3" color="#00074f">
All rights reserved - &copy; 2008 - <a style="color: #00074f;"  a href="http://www.kempeneersmultimedia.nl">Kempeneers Multimedia</a>
</font>
</center>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-3824231-1";
urchinTracker();
</script>
    </body>
</html>

  • TeeDee
  • Registratie: Februari 2001
  • Laatst online: 16:28

TeeDee

CQB 241

Een fatsoenlijke testcase online zetten. Inline stylesheets eruit slopen, eventueel javascripting eruit halen, rustig ademhalen en zelf even proberen.

Ik heb al van alles geprobeerd doesn't cut it.

[ Voor 15% gewijzigd door TeeDee op 11-03-2008 16:00 ]

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


  • jwkempeneers
  • Registratie: September 2007
  • Laatst online: 19-05-2019
Javascripting zit er niet in en die inline stylesheets worden alleen gebruikt voor een aantal stukjes tekst en dat heeft volgens mij niets met de weergave te maken.

  • TeeDee
  • Registratie: Februari 2001
  • Laatst online: 16:28

TeeDee

CQB 241

jwkempeneers schreef op dinsdag 11 maart 2008 @ 16:04:
Javascripting zit er niet in en die inline stylesheets worden alleen gebruikt voor een aantal stukjes tekst en dat heeft volgens mij niets met de weergave te maken.
Dat zou heel goed kunnen maar:

1. ik kan niet ruiken of je in prototype, scriptaculous of lightbox iets met bijv. window.onload geplaatst heb.
2. zie ik nog steeds geen fatsoenlijke (gestripte) testcase online staan.
3. het heeft imo nog steeds een hoog 'help mij even, laat ik maar zeggen dat ik alles geprobeerd heb' gehalte.

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


  • reddevil
  • Registratie: Februari 2001
  • Laatst online: 06-10 14:25
Begin met alle heights eruit te slopen en footer op clear both... lost boel op.

  • jwkempeneers
  • Registratie: September 2007
  • Laatst online: 19-05-2019
Bedankt voor de toelichting. Je hebt daar inderdaad gelijk in. Ik ga nu eerst even aan de slag met de tutorial die blatend_schaap me gaf. Als er dan nog vragen zijn zal ik proberen om ze specifieker te stellen.
Pagina: 1