tutorials.de Buch-Aktion 02/2012
ERLEDIGT
JA
ANTWORTEN
3
ZUGRIFFE
795
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. 05.07.05 13:29 #1
    svennson svennson ist offline Mitglied Gold
    Registriert seit
    May 2005
    Ort
    Haan
    Beiträge
    177
    Hi,
    ich hab mal ein tabellenloses Basislayout wie hier in einem Tutorial erklärt geschrieben, allerdings komm ich auf den Teil für den Internetexplorer nicht so ganz klar.
    Ich habs erst normal für den Firefox geschrieben und da sieht es auch so aus wie es soll.
    Nur der blöde IE brauch ja wieder ne Extrawurst
    Hier mein 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
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

    body{
background-color:#fff;
overflow:hidden
}
 
*htm body{
position:absolute;
width:100%;
height:100%;
border:0;
margin:0;
padding:0;
}
 
#top{
background-color:grey;
overflow:hidden;
position:absolute;
top:0;
left:0;
right:0;
height:125px;
z-index:1;
}
 
*html #top{
position:absolute;
top:0;
left:0;
border-top-width:0;
border-left-width:0;
border-right-width:0;
height:125px;
width:100%;
border-style:solid;
}
 
#left{
background:blue;
overflow:hidden;
position:absolute;
top:125px;
left:0;
bottom:0;
width:125px;
z-index:2;
}
 
*html #left{
position:absolute;
top:0;
left:0;
border-top-width:125px;
border-left-width:0;
border-bottom-width:0;
width:125px;
height:100%;
border-style:solid;
}
 
#right{
background-color:yellow;
position:absolute;
overflow:hidden;
top:125px;
right:0;
bottom:0;
width:125px;
z-index:3;
}
 
*html #right{
position:absolute;
top:0;
right:0;
border-top-width:125px;
border-left-width:0;
border-bottom-width:0;
width:125px;
height:100%;
border-style:solid;
}
 
#ground{
background-color:green;
position:absolute;
overflow:hidden;
left:125px;
right:125px;
bottom:0;
height:125px;
z-index:4;
}
 
*html #ground{
position:absolute;
bottom:0;
right:0;
border-bottom-width:0;
border-left-width:125px;
border-right-width:125px;
height:125px;
width:100%;
 border-style:solid; 
}
 
#center{
position:absolute;
overflow:auto;
top:125px;
left:125px;
right:125px;
bottom:125px;
}
 
*html #center{
position:absolute;
top:0;
left:0;
border-top-width:125px;
border-left-width:125px;
border-right-width:125px;
border-bottom-width:125px;
width:100%;
height:100%;
 border-style:solid;
}

    Müsste dann die *html- Sachen berichtigen, aber weiss halt nicht genau was ich da beachten muss.
    Hab zwar das Tutorial durchgelesen, aber wie ich es da verstanden habe sollte es so klappen.
    Wäre net wenn mir jemand erklären könnte was ich da beachten muss, wenn ich das mit diesem Quirksmode mache.
    Danke schonmal im Voraus.

    MFG,
    Sven
     
    ...
  2. 05.07.05 13:47 #2
    svennson svennson ist offline Mitglied Gold
    Registriert seit
    May 2005
    Ort
    Haan
    Beiträge
    177
    Hier nochmal ne leicht verbesserte Version:
    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

    body{
background-color:#fff;
overflow:hidden
}
 
*htm body{
position:absolute;
width:100%;
height:100%;
border:0;
margin:0;
padding:0;
}
 
#top{
background-color:red;
overflow:hidden;
position:absolute;
top:0;
left:0;
right:0;
height:125px;
z-index:4;
}
 
*html #top{
position:absolute;
top:0;
left:0;
border-top-width:0;
border-left-width:0;
border-right-width:0;
height:125px;
width:100%;
border-style:solid;
}
 
#left{
background:blue;
overflow:hidden;
position:absolute;
top:125px;
left:0;
bottom:0;
width:125px;
z-index:3;
}
 
*html #left{
position:absolute;
top:0;
left:0;
border-top-width:125px;
border-left-width:0;
border-bottom-width:0;
width:125px;
height:100%;
border-style:solid;
}
 
#right{
background-color:yellow;
position:absolute;
overflow:hidden;
top:125px;
right:0;
bottom:0;
width:125px;
z-index:2;
}
 
*html #right{
position:absolute;
top:0;
right:0;
border-top-width:125px;
border-right-width:0;
border-bottom-width:0;
width:125px;
height:100%;
border-style:solid;
}
 
#ground{
background-color:green;
position:absolute;
overflow:hidden;
left:125px;
right:125px;
bottom:0;
height:125px;
z-index:1;
}
 
*html #ground{
position:absolute;
bottom:0;
left:0;
border-bottom-width:0;
border-left-width:125px;
border-right-width:125px;
height:125px;
width:100%;
 border-style:solid; 
}
 
#center{
position:absolute;
overflow:auto;
top:125px;
left:125px;
right:125px;
bottom:125px;
}
 
*html #center{
position:absolute;
top:0;
left:0;
border-top-width:125px;
border-left-width:125px;
border-right-width:125px;
border-bottom-width:125px;
width:100%;
height:100%;
 border-style:solid;
}

    Wäre net wenn jemand helfen könnte, müsst euch auch nur die Sachen wo *html vorsteht anschaun.

    MFG,
    Sven
     
    ...
  3. 05.07.05 15:54 #3
    svennson svennson ist offline Mitglied Gold
    Registriert seit
    May 2005
    Ort
    Haan
    Beiträge
    177
    Habs hinbekommen,
    vielen Dank nochmal für die viele Hilfe
     
    ...
  4. 08.07.05 00:33 #4
    Avatar von Steffen Giers
    Steffen Giers Steffen Giers ist offline Mitglied Gold
    Registriert seit
    May 2004
    Beiträge
    170
    *rofl* Warum eröffnest du einen Thread obwohl du dir anscheinend selber helfen kannst? BTW so lernt man!
     
« html * und body> - Warum geht das? | Problem mit der Darstellung »

Ähnliche Themen

  1. Überlappende Elemente bei verwendetem CSS-Basislayout Kopf/Inhalt/Fuß nicht möglich
    Von janw im Forum CSS
    Antworten: 2
    Letzter Beitrag: 06.09.06, 14:57
  2. Basislayout mit variablem Inhalt
    Von jenno im Forum .NET Web und Kommunikation
    Antworten: 2
    Letzter Beitrag: 15.05.06, 15:56
  3. Tabellenloses Basislayout mit separat scrollbaren Blöcken - IE und FF unterschiedlich
    Von Maviee im Forum CSS
    Antworten: 3
    Letzter Beitrag: 30.12.05, 15:51
  4. Tabellenloses Basislayout
    Von Leon Hemke im Forum CSS
    Antworten: 1
    Letzter Beitrag: 30.03.05, 03:00