HTML/CSS Formatierung (span/div)
Verfasst: So Jun 06, 2010 12:50 pm
Hi Leute,
ich war jetzt schon laaange nich mehr hier. Erstmal ein dickes Kompliment an den Andmin für das neue Disign und eins an die Community, die, die Inhalte mit gestaltet hat.
Ich bin gerade am CSS lernen und habe schon gleich ein Problem... vielleicht wisst Ihr ja weiter.
Also es geht um folgendes Menü:
http://denkerbude.de/testx.htm
Das eigentlich so aussehen sollte:
http://denkerbude.de/?location=home
Das 1. ist nur mit <span> gemacht, während das 2. ausschließlich durch eine unsichtbare Tabelle formatiert wird. Die Spans bei dem 2. sind nur zum Sichtbar/Unsichtbar machen.
So das Problem beim 1.:
Alle Hauptschaltflächen sollen in einer Reihe sein.
Wenn jetzt ein Untermenü aufgeht, sollen immer noch alle in einer Reihe sein.
Und was ich überhaupt nicht verstehe, ist: warum geht beim untermenü von "about" das von "projects" ebenfalls auf?!?!
- spätestens hier angelangt vertehe ich gar nichts mehr...
Hier der Quellcode der 1. Seite (nur body):
Sorry, das mit der Formatierung hab ich nicht besser hinbekommen...
Hier ne kleine Skizze:

Ich brauche nur ein allgemeines Beispiel, wie ich soetwas realisieren kann. Es muss nicht unbedingt an meinem Quellcode gezeigt werden^^
Seht Ihr da durch?
ich war jetzt schon laaange nich mehr hier. Erstmal ein dickes Kompliment an den Andmin für das neue Disign und eins an die Community, die, die Inhalte mit gestaltet hat.
Ich bin gerade am CSS lernen und habe schon gleich ein Problem... vielleicht wisst Ihr ja weiter.
Also es geht um folgendes Menü:
http://denkerbude.de/testx.htm
Das eigentlich so aussehen sollte:
http://denkerbude.de/?location=home
Das 1. ist nur mit <span> gemacht, während das 2. ausschließlich durch eine unsichtbare Tabelle formatiert wird. Die Spans bei dem 2. sind nur zum Sichtbar/Unsichtbar machen.
So das Problem beim 1.:
Alle Hauptschaltflächen sollen in einer Reihe sein.
Wenn jetzt ein Untermenü aufgeht, sollen immer noch alle in einer Reihe sein.
Und was ich überhaupt nicht verstehe, ist: warum geht beim untermenü von "about" das von "projects" ebenfalls auf?!?!
- spätestens hier angelangt vertehe ich gar nichts mehr...
Hier der Quellcode der 1. Seite (nur body):
Code: Alles auswählen
<!-- Schaltfläche Home -->
<span id="s_home" style="display:inline-block">
<a href="/?location=home">
<img name="home" border="0" src="gfx/navi/home_active.gif" width="63" height="29"
onmouseout="home.src='gfx/navi/home_active.gif'" onmouseover="home.src='gfx/navi/home_hover.gif'" align="left"></a><div id="s_projects" style="block" onmouseover="menup.style.display='block'" onmouseout="menup.style.display='none'">
</span>
<!-- Schaltfläche Projects -->
<span id="s_projects" style="display:inline-block" onmouseover="menup.style.display='block'" onmouseout="menup.style.display='none'">
<img name="projects" border="0" src="gfx/navi/projects_normal.gif" width="85" height="29" onmouseout="projects.src='gfx/navi/projects_normal.gif'" onmouseover="projects.src='gfx/navi/projects_hover.gif'">
<span id="menup" style="display:none;margin-top:0px" onmouseout="menup.style.display='none'">
<img name="p_led" border="0" src="gfx/navi/p_led_normal.gif" width="85" height="21" onmouseover="p_led.src='gfx/navi/p_led_hover.gif'" onmouseout="p_led.src='gfx/navi/p_led_normal.gif'">
<br><img name="p_fotos" border="0" src="gfx/navi/p_fotos_normal.gif" width="85" height="21" onmouseover="p_fotos.src='gfx/navi/p_fotos_hover.gif'" onmouseout="p_fotos.src='gfx/navi/p_fotos_normal.gif'">
</span>
</span>
<!-- Schaltfläche "About" -->
<span id="s_about" style="display:inline-block" onmouseover="menua.style.display='block'" onmouseout="menua.style.display='none'">
<img name="about" border="0" src="gfx/navi/about_normal.gif" width="63" height="29" onmouseover="about.src='gfx/navi/about_hover.gif'" onmouseout="about.src='gfx/navi/about_normal.gif'">
<span id="menua" style="display:none" onmouseout="menua.style.display='none'">
<img name="a_feedback" border="0" src="gfx/navi/a_feedback_normal.gif" width="63" height="21" onmouseover="a_feedback.src='gfx/navi/a_feedback_hover.gif'" onmouseout="a_feedback.src='gfx/navi/a_feedback_normal.gif'">
<br><img name="a_about" border="0" src="gfx/navi/a_about_normal.gif" width="63" height="21" onmouseover="a_about.src='gfx/navi/a_about_hover.gif'" onmouseout="a_about.src='gfx/navi/a_about_normal.gif'">
</span>
</span>
<!-- Schaltfläche Gästebuch -->
<span id="s_guest" style="display:inline-block">
<a href="/?location=home">
<img name="guestbook" border="0" src="gfx/navi/guestbook_normal.gif" width="106" height="29"
onmouseout="guestbook.src='gfx/navi/guestbook_normal.gif'" onmouseover="guestbook.src='gfx/navi/guestbook_hover.gif'" align="left"></a>
</span>
Hier ne kleine Skizze:

Ich brauche nur ein allgemeines Beispiel, wie ich soetwas realisieren kann. Es muss nicht unbedingt an meinem Quellcode gezeigt werden^^
Seht Ihr da durch?
