Beiträge von rivex

rivex

Guten Tag zusammen,

ich hab mir ein Aufklappmenue im Internet gesucht, und versuche nun, es meinen wünschen anzupassen.

Das Problem ist aber, dass das aufgeklappte Menue den Inhalt darunter verschiebt, zumindest im FF.
Im IE wird nichts verschoben, wobei ich auf ein Fehler in meinem Code und einer Fehlinterpretation von IE ausgehe

Hab auch schon die Suche betätigt, finde sogar was, aber ich möchte möglichst keine absolute Positionierung verwenden.
Geht das überhaupt?

Ich poste mal ein bisschen Code, wenn was wichtiges fehlt, bitte Bescheid sagen

Achso, vielleicht noch ein paar Details zur Website:
ich habe ein 800x600 Kasten in die Mitte gesetzt, wo sich die ganze Website befinden soll.
Oben in dem Kasten Logo und Name, darunter die Navigation und darunter der Inhalt.

HTML:

Code

<div id="menuebox">
	      <div id="menue">
		      <div class="aussen">
            <span class="menutag">Home</span>
            <a class="innen-1" href="#">Systeme</a>
            <a class="innen" href="#">Speicher</a>
            <a class="innen" href="#">Laufwerke</a>
            <a class="innen" href="#">Monitore</a>
            <a class="innen" href="#">Drucker</a>
            <a class="innen" href="#">Zubehör</a>
		      </div>

		      <div class="aussen">
            <span class="menutag">Leistungen</span>
            <a class="innen-1" href="#">Netzwerke</a>
            <a class="innen" href="#">Server</a>
            <a class="innen" href="#">Wartung</a>
		      </div>

		      <div class="aussen">
            <span class="menutag">Kontakt</span>
            <a class="innen-1" href="#">Reparatur</a>
            <a class="innen" href="#">Konfiguration</a>
            <a class="innen" href="#">Software</a>
            <a class="innen" href="#">Schulung</a>
		      </div>		
	      </div>     
      </div>

Alles anzeigen

CSS:

Code

#menuebox {
margin-left:auto;
margin-right:auto;
height: 30px;
z-index:2;
}
.stupidie {
display: none;
}
#menue {
top: 5px;
margin-left:200px;
margin-right:auto;
z-index:2;
}




#menue .aussen {
float: left;
display: block;
overflow: hidden;
width: 8em;
height: 1.3em;
font-weight: bold;
text-align: center;
background-color: #888888;
color: #513913;
border: 1px solid;
border-color: #d0843e #78561d #78561d #d0843e;
}
#menue .aussen:hover {
height: auto;
background-color: #624617;
color: #fff;
}




a.innen-1 {
margin-top: 2px;
}
a.innen,
a.innen-1 {
display: block;
width: 7.9em;
padding: 2px 0;
text-decoration: none;
font-weight: normal;
border-bottom: 1px solid #78561d;
background-color: #ecd8ae;
color: #600;
}
a:visited.innen,
a:visited.innen-1 {
background-color: #ecd8ae;
color:#555;
}
a:hover.innen,
a:hover.innen-1 {
background-color: #f7eedb;
color: #900;
}




span.menutag {
display: block;
cursor: default;
}

Alles anzeigen

Rivex

rivex

Moin moin,

ich bin dabei ne Website zu programmieren (mit Css)
und stoße dabei immer wieder auf Probleme, die ich bisher immer
(entweder durch zufall,recherche oder ausprobieren) lösen konnte.

Nun weiß ich aber nicht weiter, auch nach den Lösungsansätzen (s.o. :wink: )
nicht.

[Blockierte Grafik: http://img5.imagebanana.com/img/f123bad8/site.png]

So ist meine Website auf gebaut, funktioniert alles wunderbar.
Mein Problem ist aber, dass ich einen Doppelstreifen haben möchte, von oben nach unten.
Auf dem blau makierten Stückchen hab ich das mit meiner Hintergrundgrafik gelöst, wo auch andere Sachen drauf sind, z.B. die Buttons.

Das Rotmakierte soll jetzt so lang sein, wie ich Inhalt auf meiner Seite habe (im Inhalt -div-tag).
Wie krieg ich dass hin?
Ich wollte das mit einem Bild machen, was diesen Doppelstreifen beinhaltet und dann in y-Richtung wiederholt wird, auch in einem Div-Tag.

Leider funktioniert das ganze nur mit absoluten Werten, auch wenn ich % angebe ist der Balken nicht so lang, wie die Seite ist.

So sieht meine Hintergrundgrafik aus:
http://img5.imagebanana.com/img/x3224d4m/BG.png

Hier sind Auszüge aus meiner css-Datei
op soll mein Div-Tag sein, der den Doppelstreifen weiterführt.

Code

#navi {
  height:100%;
  font-size:24pt;
  vertical-align:middle;
  font-color:4eceff;
  font-family: Arial;
  width:198px;
  float:left;
  }




#inhalt{
  float:right;
  width:602px;
  padding-top:3px;
  font-family: Arial;
  }

#op {
  width:198px;
  height:100%;
  float:left;
  background:url(../bilder/BGu.png);
  background-repeat:repeat-y;
  }

Alles anzeigen

Den op-div-tag hab ich varschachtelt mit dem Navi-div-tag.
Also das der Navi-div-tag übergeordnet ist.

SOooo das wars.
Ist verdammt schwierig gewesen, mein Anliegen rüberzubringen :lol:
Ich hoffe ich habs einigermaßen geschafft.

Beiträge von rivex

Aufklappmenue verschiebt Inhalt darunter

Probleme mit einem Div-Tag, height = Seitenhöhe?!