Ist vermutlich ein reines CSS Problem, aber dachte die Kategorie Menü passt soweit. Falls nicht bitte entsprechend verschieben.
Habe mir das vertikale Menü von just2b ausgeguckt um es in die Seite einzubinden die ich momentan erstelle. In Opera und FF läuft auch schon alles perfekt, aber der IE macht Probleme.
Das Menü wird zu tief und zu weit rechts dargestellt.
So soll es aussehen:
Bild: img185.imageshack.us/…/operazd9.th.jpg
So sieht es im IE aus:
Bild: img185.imageshack.us/…/ieoberekg5.th.jpg
Habe die Angaben aus dem Tutorial soweit übernommen.
So langsam rege ich mich wirklich darüber auf das ich nicht weiterkomme weil die Herren in Redmond ihren Browser noch immer nicht dazu gebracht haben gängige Standards zu befolgen. Jemand interesse an einer Petition zur weltweiten verbannung des IE?
So schaut die Einbindung im Template aus:
<div id="Rahmen">
<div id="Menu">
<div class="level1"><a href="bla.htm">Link</a></div>
<div class="level2"><a href="bla.htm">Link</a></div>
<div class="level1"><a href="bla.htm">Link</a></div>
</div>
</div>
Hier der relevante Inhalt der CSS Datei
51 div#Rahmen {
52 font-size: 9pt;
53 float: left;
54 width: 200px;
55 height: auto;
56 background-color: #e3e3e3;
57 }
58
121 ul#nav,
122 ul#nav ul {
123 margin-left: 10px;
124 margin-top: 10px;
125 padding: 0;
126 width: 160px; /* Width of Menu Items */
127 border-bottom: 1px solid #ccc;
128 background: #eee; /* IE6 Bug */
129 color: black;
130 font-size: 100%;
131 }
132
133 ul#nav li {
134 position: relative;
135 list-style: none;
136 }
137
138 ul#nav li a {
139 display: block;
140 text-decoration: none;
141 color: #777;
142 padding: 5px;
143 border: 1px solid #ccc;
144 border-bottom: 0;
145 }
146
147
148 /* Fix IE. Hide from IE Mac \*/
149 * html ul#nav li { float: left; height: 1%; }
150 * html ul#nav li a { height: 1%; }
151 /* End */
152
153 ul#nav ul {
154 position: absolute;
155 display: none;
156 left: 149px; /* Set 1px less than menu width */
157 top: 0;
158 }
159
160 ul#nav li ul li a { padding: 2px 5px; } /* Sub Menu Styles */
161
162 ul#nav li:hover ul ul,
163 ul#nav li:hover ul ul ul,
164 ul#nav li.over ul ul,
165 ul#nav li.over ul ul ul { display: none; } /* Hide sub-menus initially */
166
167 ul#nav li:hover ul,
168 ul#nav li li:hover ul,
169 ul#nav li li li:hover ul,
170 ul#nav li.over ul,
171 ul#nav li li.over ul,
172 ul#nav li li li.over ul { display: block; } /* The magic */
173
174 ul#nav li.menuparent { background: transparent url(arrow.gif) right center no-repeat; }
175
176 ul#nav li.menuparent:hover,
177 ul#nav li.over {
178 background-color: #f9f9f9;
179 }
180
181
182 ul#nav li a:hover {
183 color: #E2144A;
184 background-color: #f9f9f9;
185 }