✔ CSS Infobox mit Links in der Box

zempsit

zempsit

Erfahrenes Mitglied
Hallo zusammen,

ich will in einer CSS-Infobox jeweils eine Liste von Links aufreihen, die alle auf unterschiedliche Seiten verweisen. Also quasi <a>-Tags in einem <a>-Tag. In Opera funktioniert dies auch ohne Probleme. Und auch im Firefox wird in der Statusleiste der richtige Link angezeigt. Sobald ich aber darauf klicke, wird das Ziel des Infobox-<a>-Tag geöffnet.

z-index habe ich bereits probiert. Das ändert auch nichts. Hat jemand von euch eine Idee, wie man das Problem lösen könnte?

mfg
 
Hi,

wenn das erste a-Element mit einem Verweisziel benötigt wird, kommst du hier nicht um ein Dropdown-/Dropline-Menü herum:
HTML: 
<ul>
    <li><a href="verweisziel.html">top1</a>
        <ul>
            <li><a href="subverweisziel_1.html">sub1</a></li>
            <li><a href="subverweisziel_2.html">sub2</a></li>
            <li><a href="subverweisziel_3.html">sub3</a></li>
        </ul>
    </li>
</ul>
CSS: 
ul { margin:0; padding:0; list-style:none; }
ul li ul { display:none; }
ul li:hover ul { display:block; }

mfg Maik
 
Dein Post hat mich darauf gebracht, dass ich im ersten a-Element gar kein Verweis brauche, d.h. bisher hatte ich dort ' href="" ', jetzt habe ich das einfach herausgenommen und es funktioniert, zumindest in Firefox, Opera und IE 6.

mfg
 
Valide ist dein Konstrukt dadurch aber noch immer nicht.

http://de.selfhtml.org/html/referenz/elemente.htm#a hat gesagt.:
Kindelemente Darf #PCDATA und folgende andere HTML-Elemente enthalten: [Inline-Elemente] (außer a)
Zum Vergrößern anklicken....
http://validator.w3.org/check hat gesagt.:
Error Line:XX, Column 21: document type does not allow element "A" here

<a><span><a href="verweisziel1.html" > link</a></span></a>

The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).
Zum Vergrößern anklicken....

mfg Maik
 
Ja, da hast du recht. Aber die "li:hover"-Variante scheitert dafür an unserem aller Lieblingsbrowser ie 6.0.

Mal schauen, vielleicht finde ich noch eine andere Lösung.
 
Hi,

ich hab da was für dich und den IE6 :)

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<meta name="author" content="Maik">
<meta name="date" content="2009-05-19">

<title>tutorials.de | demo_zempsit</title>

<style type="text/css">
<!--
ul { margin:0; padding:0; list-style:none; }
ul li ul { display:none; }
ul li:hover ul { display:block; }
-->
</style>
<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script>
<![endif]-->

</head>
<body>

<ul>
    <li><a href="verweisziel.html">top1</a>
        <ul>
            <li><a href="subverweisziel_1.html">sub1</a></li>
            <li><a href="subverweisziel_2.html">sub2</a></li>
            <li><a href="subverweisziel_3.html">sub3</a></li>
        </ul>
    </li>
</ul>

</body>
</html>


http://code.google.com/p/ie7-js/ -> http://ie7-js.googlecode.com/svn/test/hover.html

mfg Maik
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück