Gegen Bilderklau - Das Original | Druckvorschau: Klappmenü in die länge

Geschrieben von Lolle.herz am 09.07.2012 um 16:38:

Klappmenü in die länge

Hallo,

Ich habe mal wieder ein Problem mit meinem Menü. Ich weiß nicht warum das so ist, aber es will einfach nicht in die Länge gehen.
Die ersten 3 Menüpunkte sind so wie ich sie haben möchte, aber die andere 3 (ab "Zuchtpferde" ) sind plötzlich darunter?
Kann mir jemand helfen das alle Menü punkte gerade in einer Reihe sind? Ich habe alles versucht...

CSS 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:

#menu {
  font-size:14px;
  position:absolute;  
}

#menu ul {
  list-style-type:none;
  list-style-image:none;
  margin:0px;
  padding:0px;
}

#menu li.topmenu {
  float:left;
}

.topmenu a {
  float:left;
  width:100px;
  text-align:center;
}

.topmenu ul{
  display:none;
}

.topmenu a, .submenu a{
  padding:1px 5px;
  border:1px solid #C37000;
  border-collapse:collapse;
  color:#C37000;
  font-weight:bold;
  text-decoration:none;
  background-color:#7F4800;
  margin:0;  
}

.submenu a{
  font-size:12px;
  width:110px;
  position:relative;
  clear:both; /* special IE6 */
}

#menu a:hover, .topmenu.on a {
  color:#4C4C4C;
  background-color:#ffddbb !important;
}

.topmenu:hover ul {
  display:block;  
  z-index:500;
}

Menü 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:

<html>
<head>
<link rel='stylesheet' href='css.css' type='text/css'>
</head>
<body>  
  <div id="menu">
    <ul>
      <li class="topmenu">
        <a href="">Startseite</a>
        <ul>
        <br>
        <br>
          <li class="submenu"><a href="">Unterpunkt 1.1</a></li>
          <li class="submenu"><a href="">Unterpunkt 1.2</a></li>
        </ul>
      </li>
      <li class="topmenu">
        <a href="">Unser Gestüt</a>
        <ul>
        <br>
        <br>
          <li class="submenu"><a href="">Unterpunkt 2.1</a></li>
          <li class="submenu"><a href="">Unterpunkt 2.2</a></li>
        </ul>
      </li>
      <li class="topmenu">
        <a href="">Die Zucht</a>
        <ul>
        <br>
        <br>
          <li class="submenu"><a href="">Unterpunkt 3.1</a></li>
          <li class="submenu"><a href="">Unterpunkt 3.2</a></li>
        </ul>
      </li>
    </ul>
    <ul>
      <li class="topmenu">
        <a href="">Zuchtpferde</a>
        <ul>
        <br>
        <br>
          <li class="submenu"><a href="">Unterpunkt 1.1</a></li>
          <li class="submenu"><a href="">Unterpunkt 1.2</a></li>
        </ul>
      </li>
      <li class="topmenu">
        <a href="">Turnierpferde</a>
        <ul>
        <br>
        <br>
          <li class="submenu"><a href="">Unterpunkt 2.1</a></li>
          <li class="submenu"><a href="">Unterpunkt 2.2</a></li>
        </ul>
      </li>
      <li class="topmenu">
        <a href="">Nachzucht</a>
        <ul>
        <br>
        <br>
          <li class="submenu"><a href="">Unterpunkt 3.1</a></li>
          <li class="submenu"><a href="">Unterpunkt 3.2</a></li>
        </ul>
      </li>
    </ul>
    <ul>   
    </ul>
  </div>
</body>
</html>

Index Code:

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:

<html>
<head>
<title>Virtuelles Gestüt Fairytale</title>
<BODY marginwidth="0" leftmargin="0" marginheight="0" topmargin="0" scroll="auto">
<body background="Hintergrund.png"></body>
<IMG NAME="Design1" SRC="DesignFairytale.png" WIDTH="1024" HEIGHT="768" BORDER="0" USEMAP="Hintergrund.png">

<center><div id="Layer1" style="position: absolute; left: 39px; top: 307px;">
<iframe src="main.html" name="main" width="942" height=354" frameborder=0 scrolling="auto" noresize style="border: 0px" style="FILTER: chroma (color=#ffffff)" ;>
</iframe>
</div>

<center><div id="Layer2" style="position: absolute; left: 160px; top: 237px;">
<iframe src="menu.html" name="menu" width="900" height="100" frameborder=0 scrolling="auto" noresize style="border: 0px" style="FILTER: chroma (color=#ffffff)" ;>
</iframe>
</div>
</body>
</html>

Ich würde mich sehr über eine Hilfe freuen. Momentan sieht es so aus: *klick*

mfg Judith

Geschrieben von Nanni am 09.07.2012 um 21:36:

Also ich kenn mich mit dem Ding nicht wirklich gut aus, aber ich hab eine Vermutung:
Ich würde sagen es liegt an dem </ul> <ul> zwischen "Die Zucht" und "Zuchtpferde", ist ja irgendwie auffällig, wieso du zwischen den beiden Menüpunkten ul beendest und neu anfängst und zwischen den anderen nicht ;D

Geschrieben von WuLana am 10.07.2012 um 09:10:

hmmm wenn ich mir das ganze in dreamweaver anguck funktionierts einwandfrei, hat also was mit der frame größe zu tun wo das ganze drin liegt
eventuell vergrößerst du das ganze design in die breite oder probierst einfach ma ne verdoppelung des divs bzw des frames
grundlegend würde ich dir ja empfehlen statt i frames divs zu verwenden die sind verträglicher, benötigen aber php,
wenn du willst kann ich dir das auf php umcoden dann gehts vllt
lg oldy

Geschrieben von Lolle.herz am 11.07.2012 um 18:29:

Vielen Dank Nanni & und auch Oldgirl.

Ich habe nun aber noch eine Frage. Nun ist zwar alles gerade aber so eng zusammen... und nur beim rüber fahren mit der Maus gehen die Menüpunkte auseinander.
Kann mir jemand sagen wie ich die Menüpunkte von Anfang an auseinander bekomme?

Zudem öffnet mein Menü die Menüpunkte immer im Menüfeld... Weiß jemand zufällig wie ich es anders hinbekomme?

mfg Judith

Geschrieben von WuLana am 11.07.2012 um 20:13:

das mit dem öffnen würd ich aufs i frame schieben,
wie man das wegbekommt:
mit divs &include arbeiten damit der das ins andre div includiert weil sonst öffnet das der in dem frame wo sich das befindet
Ich könnt dir den index code dafür schreiben und erklären wenn du willst wie schon gesagt^^

lg oldy
edit: ehm mit den größenänderungen kann ich dir leider nicht wirklich helfen aber spiel ma bissl im css rum bei "width"

Geschrieben von Lolle.herz am 11.07.2012 um 20:25:

Hallo Oldgirl,

Ich habe dir eine PN geschrieben Augenzwinkern

mfg Judith