Toon posts:

[html/css]site zonder frames problemen

Pagina: 1
Acties:

Verwijderd

Topicstarter
Al een tijdje probeer ik een website te maken zonder frames, maar loop tegen het probleem dat alleen netscape(7) de website laat zien zoals ik het wil.

Aller eerst heb ik geprobeerd een website te maken met alleen div-jes, die wel "meerekt" met de website, maar in IE doet hij het niet goed;
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
<html>
<head>
<title></title>

<style type="text/css">
body, html {
  height: 100%;
  overflow: hidden;
  text-align: center;
}

div, body {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

#content {
  position: relative;
  width: 800px;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  visibility: visible ;
  padding-bottom:178px;
}

* {
margin:0;
border:0;
padding:0;
}

#header {
  width: 800px;
  height: 150px;
  background:blue;
 }

#footer {
  height: 14px;
  width:800px;
  clear: both;
  font-size:0px;
  background:blue;
}

#main {
  height: 100%;
  overflow: auto;
  width:540px;
  float:left;
  background:red;
  padding-bottom:178px;
}

#balk{
  height: 14px;
  font-size:0px;
  width:540px;
  float:left;
  background:yellow;
}

#sidebar {  
  float: right;
  width: 260px;
  height: 100%;
  padding-bottom:60px;
}

#sidebar-right {
  float: right;
  width: 177px;
  height: 100%;
  padding-bottom:148px;
 
}

#sidebar-right-top{
  height:100%;
  background:red;
  overflow:hidden;
}

#sidebar-left{
  height:100%;
  width:83px;
  float:left;
  background:yellow;
}

#sidebar-top {
  text-align:left;
  height: 75px;
  width:260;
  background:red;
}

#sidebar-right-bottom{
  text-align:left;
  height:148px;
  margin:0;
  padding:0;
  border:0;
  background:blue;
}


</style>

</head>
<body>

<div id="content" align="left">
  <div id="header" ></div>
  <div id="sidebar" align="right">
    <div id="sidebar-top"></div>
    <div id="sidebar-left"></div>
    <div id="sidebar-right">
        <div id="sidebar-right-top"></div>
        <div id="sidebar-right-bottom"></div>
    </div>
  </div>
  <div id="balk"></div>
  <div id="main"></div>
  <div id="footer"></div>
</div>


</body>
</html>

www.vrijbuiters.com/wjo/div.htm
Weet iemand waar dat aan ligt? heb het ook geprobeert met alle div-jes relative en dan left en top opgeven, maar dan heb ik ongeveer het zelfde probleem als hier boven. Ook heb ik de divjes een top en een bottom gegeven maar dat werkt weer niet in IE maar wel perfect in netscape.

Toen dat allemaal niet lukte heb ik het zelfde geprobeert maar dan met tabellen, toen ik bijna klaar was kwam ik er achter dat ik wat cellen was vergeten dus deed ik een tabel in een tabel. Normaal werkt dat altijd maar nu krijg ik in IE rare lege ruimtes (rechts onder) en in netscape niet. Hoe kan dat?
www.vrijbuiters.com/wjo/tabel.htm

Als laatste als jullie websites maken, maken jullie die dan voor 1 resolutie (800 breed) of laten jullie die ook "meerekken"? Wat is het meest handige? Als je een website maakt voor verschillende resoluties loop je tegen een aantal problemen, je kan dan een resolutie test doen. Maar als iemand een google bar heeft gaat dat feest natuurlijk weer niet op. Mijn vraag is dus hoe gaan jullie daar mee om?

  • Justice
  • Registratie: Maart 2001
  • Laatst online: 07-08-2025
Een website nooit voor een bepaalde hoogte maken, en nooit voor een bepaalde breedte (of 760px maximaal en dan bijvoorbeeld centreren.)

Lege ruimtes komen waarschijnlijk doordat IE in quirkmodus (quirks modus ?) draait en Mozilla niet (of andersom) als je zoekt op doctype switching kom je tegen wanneer welke browser in welke modus zit (dit verschilt), lege ruimtes kunnen bij plaatjes in een tabelcel opgelost worden door display:block in je css.

Verder heb ik nog niet naar je code gekeken maar dit moet je al verder kunnen helpen.

Human Bobby


  • Elroy
  • Registratie: April 2000
  • Laatst online: 20-05 21:34

Elroy

Zelda!!!

Bij IE gaat het fout omdat je 100% height zegt.
Dat betekend dat IE het hele schem gebruik.
Als je linker muis ingedrukt houd en hem dan naar beneden beweegt, dan zie je dat de div gewoon doorloopt.
Je kan hier beter tabellen voor gebruiken.

Specs Computer


Verwijderd

Topicstarter
Justice schreef op 04 februari 2004 @ 14:27:
....
Lege ruimtes komen waarschijnlijk doordat IE in quirkmodus (quirks modus ?) draait en Mozilla niet (of andersom) als je zoekt op doctype switching kom je tegen wanneer welke browser in welke modus zit (dit verschilt), lege ruimtes kunnen bij plaatjes in een tabelcel opgelost worden door display:block in je css.
.....
Zet ik dan in mijn css
code:
1
2
3
td {
display:block;
}
Elroy schreef op 04 februari 2004 @ 14:31:
Bij IE gaat het fout omdat je 100% height zegt.
Dat betekend dat IE het hele schem gebruik.
Als je linker muis ingedrukt houd en hem dan naar beneden beweegt, dan zie je dat de div gewoon doorloopt.
Je kan hier beter tabellen voor gebruiken.
Daar was ik ook achter(muis), maar het is dus niet mogelijk om in IE div-jes te gebruiken met 100%?

  • Justice
  • Registratie: Maart 2001
  • Laatst online: 07-08-2025
HTML:
1
2
3
...
<td>[img]"plaatje.jpg"[/img]</td>
...

Cascading Stylesheet:
1
2
3
img.block {
display:block;
}

Bij text is dit geen probleem dus hoeft het niet.

Human Bobby


  • Dr_Frickin_Evil
  • Registratie: Mei 2000
  • Laatst online: 26-05 16:31
Justice schreef op 04 februari 2004 @ 14:27:
Een website nooit voor een bepaalde hoogte maken, en nooit voor een bepaalde breedte (of 760px maximaal en dan bijvoorbeeld centreren.)
Waarom nooit voor een bepaalde breedte? Ik vind dat er helemaal niet lelijk uitzien. Gewoon +/- 700-750px breed en links uitlijnen, vind ik het handigst.

Verwijderd

Topicstarter
Justice schreef op 04 februari 2004 @ 15:17:
HTML:
1
2
3
...
<td>[img]"plaatje.jpg"[/img]</td>
...

Cascading Stylesheet:
1
2
3
img.block {
display:block;
}

Bij text is dit geen probleem dus hoeft het niet.
Ok ik snap het alleen begrijp ik niet waarom er rechts onderin toch een ruimte over blijft van +- 10px (onder het plaatje van visa enzo)
www.vrijbuiters.com/wjo/tabel.htm
Afbeeldingslocatie: http://www.vrijbuiters.com/wjo/tabel.jpg

[ Voor 15% gewijzigd door Verwijderd op 04-02-2004 15:38 ]


  • Justice
  • Registratie: Maart 2001
  • Laatst online: 07-08-2025
Dr_Frickin_Evil schreef op 04 februari 2004 @ 15:23:
[...]

Waarom nooit voor een bepaalde breedte? Ik vind dat er helemaal niet lelijk uitzien. Gewoon +/- 700-750px breed en links uitlijnen, vind ik het handigst.
Omdat je niet weet wat de maximale breedte van het scherm waarop je website bekeken wordt is.

Human Bobby


Verwijderd

Topicstarter
Weet niemand een oplossing voor deze problemen?
Pagina: 1