Naviagtionsleiste und IFRAME

Hallo,

ich habe ein Problem mit meiner Navitationsleite. Ich habe sie nach http://de.selfhtml.org/css/layouts/anzeige/nav_modern.htm diesem Beispiel aufgebaut und will sie nun in ein iframe setzen. Mein Problem ist nun, dass sie gleich den ganzen Platz (den für den Aufgefalteten Modus) braucht. Ist es möglich sie so zu gestallten, dass sie über den Text geht und nicht den Platz weg nimmt?

Mfg Jens

driver

pass einfach die width-werte entsprechend an....

infernalshade

-entfernt-

driver

ah... ok.... dann evtl den z-index auf 2 setzen...

Shade

Shade Ja genau so meine ich es.

Ich habe auch schon versucht die hight-werte anzupassen, aber leider könnte man dann die Aufgeklappte Navigation nicht mehr sehen.

Was ist ein z-index?

Mfg Jens

infernalshade

-entfernt-

jojo87

Der z-index bestimmt bei sich überlappenden Elementen, welches Element Priorität geniesst, also über dem anderen angezeigt wird.

Setze also in deine css für den navi-frame

Code

z-index:1;

und für den frame mit inhalt

Code

z-index:2;

Hoffe das hilft.
Jojo

infernalshade

-entfernt-

jojo87

uuuuuuuuuupppppppppppppppsssssssss.
Hätt ich mal gewartet bis du fertig bist...:-)

Leider verstehe ich das ganze nicht so ganz (ich weiß nicht wo nun das div hin soll)

Ich habe hier mal die Auszüge von meine Quelltexten:

Code

.....</tr>
    <tr>
    <td>




       <iframe src="nav.html" scrolling="no" border="0" width="800" frameborder="0" height="50"></iframe>
    </td>
    </tr>
    <td width="800" height="200">


    </td>
    </table>
  </td>
  </tr>
  </table>....

Alles anzeigen

Und mein Frame:

Code

<div id="Rahmen"><ul id="Navigation">
    [*][url='#Beispiel']Office[/url]
        <ul>
        [*][url='#Beispiel']Home[/url]
        [/list]

    [*][url='#Beispiel']Test1[/url]
      <ul>
        [*][url='#Beispiel']Test2[/url]
        [*][url='#Beispiel']Test2[/url]
      [/list]



    [*][url='#Beispiel']Seite 3[/url]


    [*][url='#Beispiel']Seite 4[/url]
      <ul>
        [*][url='#Beispiel']Seite 4a[/url]
        [*]
        [*][url='#Beispiel']Seite 4c[/url]
      [/list]



    [*][url='#Beispiel']Seite 5[/url]
  [/list]<div>

Alles anzeigen

Außerdem ist bei meinem Frame noch am Anfang unter Head die Anweisung zu der Navileiste (CSS)

Gibt es sonst noch eine andere Möglichkeit? Ich möchte die Navigation gerne in ein Iframe packen, weil ich sie dann schneller verändern kann.

Mfg Jens

des-man

Hi,
ich würd das wie von infernalshade vorgeschlagen mit einem
Div lösen...dann haste das Problem nich.

Und deine letzte Aussage versteh ich nich,
kannst das doch überall gleich schnell ändern...ob du jetzt etwas im <div>
änderst oder im <iframe> is doch lax oder nich??

desman

Ja, aber ich verstehe das nicht ganz, kannst du mir das mal in dem Quelltext so verändern?

des-man

dazu bräuchten wir die Css-Datei....
....damit wir wissen, wie das Css-File die Div's "formt".

Zitat

<style type="text/css">

body {
font: normal 100.01% Helvetica, Arial, sans-serif;
color: black; background-color: #F5F5FF; z-index:2;

}

div#Rahmen {
width: 800px;
padding: 0px;
border: 0px;
background-color: #F5F5FF;
}
* html div#Rahmen { /* Korrektur fuer IE 5.x */
width: 800px;
w\idth: 800px;
}
div#Rahmen div {
clear: left;
}
ul#Navigation {
margin: 0; padding: 0;
text-align: center;
z-index:2;
}

ul#Navigation li {
list-style: none;
float: left; /* ohne width - nach CSS 2.1 erlaubt */
position: relative;
margin: 0.4em; padding: 0;
}
* html ul#Navigation li { /* Korrektur fuer den IE 5 und 6 */
margin-bottom: -0.4em;
}
*:first-child+html ul#Navigation li { /* Korrektur fuer den IE 7 */
margin-bottom: -0.1em;
}

ul#Navigation li ul {
margin: 0; padding: 0;
position: absolute;
top: 1.6em; left: -0.4em;
display: none; /* Unternavigation ausblenden */
}
* html ul#Navigation li ul { /* Korrektur fuer IE 5.x */
left: -1.5em;
lef\t: -0.4em;
}
*:first-child+html ul#Navigation ul { /* Workaround fuer den IE 7 */
background-color:silver; padding-bottom:0.4em;
}
ul#Navigation li:hover ul {
display: block; /* Unternavigation in modernen Browsern einblenden */
}
ul#Navigation li ul li {
float: none;
display: block;
margin-bottom: 0.2em;
}

ul#Navigation a, ul#Navigation span {
display: block;
width: 6.4em; /* Breite den in li enthaltenen Elementen zuweisen */
padding: 0.2em 1em;
text-decoration: none; font-weight: bold;
border: 1px solid black;
border-left-color: white; border-top-color: white;
color: maroon; background-color: #ccc;
}
* html ul#Navigation a, * html ul#Navigation span {
width: 8.6em; /* Breite nach altem MS-Boxmodell für IE 5.x */
w\idth: 6.4em; /* korrekte Breite fuer den IE 6 im standardkonformen Modus */
}
ul#Navigation a:hover, ul#Navigation span, li a#aktuell {
border-color: white;
border-left-color: black; border-top-color: black;
color: white; background-color: gray;
}
li a#aktuell { /* aktuelle Rubrik kennzeichnen */
color: maroon; background-color: silver;
}
ul#Navigation li ul span { /* aktuelle Unterseite kennzeichnen */
background-color: maroon;
}

</style>

Alles anzeigen

CSS Datei der Navigation, meine Hautseite hat noch keine CSS Datein.

Mfg Jens

Ist das falsch?

Tags