Community rund um Cascading Style Sheets, Tutorials & KnowHow für Webmaster

CSS-Menü macht probleme

Antwort erstellen

CSS-Menü macht probleme

Beitragvon elmo » 17.02.2010, 17:40

Hallo,

ich kämpfe seit stunden mit folgendem problem:

ich habe eine "Roll-Down" menü runtergeladen und will in meine seite einbauen. die adresse ist:
http://burmeister-tourismus-hamburg.de/mlb/xx/

das problem ist, wenn ich mit der mause auf menü-punkt "leistungen" gehe sobald ich die unteren submenüs anklicken will, verschwindet die menüleiste. ich glaube es hat damit zutun, daß die eben der menüleiste unter der des contents liegt. ich weiss leider nur nicht, wie ich es korregieren kann. ich setze sowohl den code von meiner css-datei wie auch die html-datei hier rein und würde mich sehr freuen, wenn jemand mir meinen fehler in dem code zeigen könnte.
gruß, elmo
---------------------------------------------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Faux Column CSS Layouts - 3 Column - faux-4-3-col</title>
<link rel="stylesheet" type="text/css" href="main.css" />
<!--[if IE]>
<script type="text/javascript">
if(window.navigator.systemLanguage && !window.navigator.language) {
function hoverIE() {
var LI = document.getElementById("Navigation").firstChild;
do {
if (sucheUL(LI.firstChild)) {
LI.onmouseover=einblenden; LI.onmouseout=ausblenden;
}
LI = LI.nextSibling;
}
while(LI);
}

function sucheUL(UL) {
do {
if(UL) UL = UL.nextSibling;
if(UL && UL.nodeName == "UL") return UL;
}
while(UL);
return false;
}

function einblenden() {
var UL = sucheUL(this.firstChild);
UL.style.display = "block"; UL.style.backgroundColor = "#eee";
}
function ausblenden() {
sucheUL(this.firstChild).style.display = "none";
}

window.onload=hoverIE;
}
</script>
<![endif]-->

</head>

<body>

<!-- Begin Wrapper -->
<div id="wrapper">

<!-- Begin Header -->
<div id="header">

This is the Header

</div>
<!-- End Header -->
<!-- Begin Navigation -->
<div id="Tmenu">
<ul id="Navigation">
<li><a href="../index.html" target="_top">Home</a></li>
<li><a href="pflasterarbeit_hamburg_ueber_uns.html" target="_top">Über uns</a></li>
<li><a href="#">Leistungen</a>
<ul>
<li><A href="pflasterarbeit_hamburg_pflaster.html">Pflaster</a></li>
<li><A href="pflasterarbeit_hamburg_schwarzdeckenbau.html">Schwarz- deckenbau</a></li>
<li><A href="pflasterarbeit_hamburg_terrassenbau.html">Terrassenbau</a></li>
<li><A href="pflasterarbeit_hamburg_einfahrten_hof_zuwegung.html">Einfahrten/Hof usw.</a></li>
<li><A href="pflasterarbeit_hamburg_oberflaechenwiederherrstellung.html">Oberflaechen- wiederherrstellung</a></li>
</ul>
</li>
</ul>
</div>
<!-- End Navigation -->
<!-- Begin Faux Columns -->
<div id="faux">

<!-- Begin Left Column -->
<div id="leftcolumn">



</div>
<!-- End Left Column -->

<!-- Begin Content Column -->
<div id="content">jhgjhgAJHGAjhg jhAGHgajsgh jHAGS Jhgasj HG ASJHg ajshg JHASGJhags jhAGS JHag sjhAG SJHg asjhG AJSHG jasg jHAG SJHga sjhG AJSHG jasg jHAG SJHg ajhg AJSHG Ajg

</div>
<!-- End Content Column -->



<!-- Begin Right Column -->
<div id="rightcolumn">




</div>
<!-- End Right Column -->

</div>
<!-- End Faux Columns -->

<!-- Begin Footer -->
<div id="footer">

This is the Footer

</div>
<!-- End Footer -->

</div>
<!-- End Wrapper -->
</body>
</html>
----------------------------------------------------------------------------------------------------
/*
Created by Keith Donegan of Code-Sucks.com

E-Mail: Keithdonegan@gmail.com

You can do whatever you want with these layouts,
but it would be greatly appreciated if you gave a link
back to http://www.code-sucks.com

*/

* { padding: 0; margin: 0; }

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
}
#wrapper {
margin: 0 auto;
width: 922px;
}

/***************************************/
#Tmenu {
font-size: 94%;
width: 69.1em;
height: 0em;
padding: 0.8em;
border: 1px solid white;
background-color: #FFF;
}
* html div#Tmenu {
width: 41.4em;
w\idth: 70.8em; /* IE 6 in standards-compliant mode */
}
div#Tmenu div {
clear: left;
}
ul#Navigation {
margin: 0; padding: 0;
text-align: left;
}

ul#Navigation li {
list-style: none;
float: left;
position: relative;
margin: 0.4em; padding: 0;
}
* html ul#Navigation li {
margin-bottom: -0.4em;
}

ul#Navigation li ul {
margin: 0; padding: 0;
position: absolute;
top: 1.8em; left: -0.4em;
}
* html ul#Navigation li ul {
left: -1.5em;
lef\t: -0.4em;
}
ul#Navigation li ul li {
float: none;
display: block;
margin-top: 0.2em; margin-bottom: 0.2em;
}

ul#Navigation a, ul#Navigation span {
display: block;
width: 8.5em;
font-family: "Trebuchet MS", "Century Gothic", Helvetica, Arial, sans-serif;
text-decoration: none; font-weight: normal;
padding: 0.17em 0.97em 0.17em 1.03em;
border: 1px solid #0066cc;
border-left-color: #0066cc; border-top-color: #0066cc;
color: white; background-color: #0066cc;
}
* html ul#Navigation a, * html ul#Navigation span {
width: 9.2em;
w\idth: 10.4em; /* IE 6 in standards-compliant mode */
}
ul#Navigation a:hover, ul#Navigation span, li a#aktuell:hover {
padding: 0.17em 1.03em 0.23em 0.97em;
border-color: #E6E6E6;
border-left-color: #E6E6E6; border-top-color: #E6E6E6;
background-color: #E6E6E6;
COLOR: #696969;
}
ul#Navigation li ul a:hover {
border-color: #E6E6E6;
}
li a#aktuell {
border-right-color: #300; border-bottom-color: #300;
background-color: #E6E6E6;
}
ul#Navigation li ul span {
border-right-color: #c96; border-bottom-color: #c96;
color: #900; background-color: white;
}
ul#Navigation li a:active, ul#Navigation li:hover a:active {
color: black; background-color: #E6E6E6;
}

/* dynamisches Ein-/Ausblenden */
ul#Navigation li ul {
display: none;
}
ul#Navigation li:hover ul {
display: block;
/*background: #eee;*//********************* hintergrund der submenues********/
}
/************************************************************************************/
/***************************************/
#navigation {
color: #333;
padding: 10px;
margin: 0px 0px 5px 0px;
background: #ABBEBE;
}
#faux {
background: url(faux-1-3-col.gif);
margin-bottom: 5px;
overflow: auto; /* Paul O Brien Fix for IE http://www.pmob.co.uk */
width: 100%
}
#header {
color: #333;
width: 902px;
padding: 10px;
height: 100px;
margin: 10px 0px 5px 0px;
background: #D1DBDB;
}

#leftcolumn {
display: inline;
color: #333;
margin: 10px;
padding: 0px;
width: 195px;
float: left;
}
#content {
float: left;
color: #333;
margin: 10px 13px;
padding: 0px;
width: 460px;
display: inline;
position: relative;
}
#rightcolumn {
display: inline;
position: relative;
color: #333;
margin: 10px 10px 10px 0px;
padding: 0px;
width: 195px;
float: right;
}
#footer {
width: 902px;
clear: both;
color: #333;
background: #ABBEBE;
margin: 0px 0px 10px 0px;
padding: 10px;
}

/*****************************************/

.clear { clear: both; background: none; }
elmo
neu hier
 
Beiträge: 1
Registriert: 17.02.2010, 17:25
Nach oben

Re: CSS-Menü macht probleme

Beitragvon sejuma » 18.02.2010, 07:27

Mir ist das jetzt so viel Arbeit, den Code durchzuarbeiten, zumal ich von Javascript nichts verstehe.
Versuch's mal damit: http://www.ohne-css.gehts-gar.net/0066.php
Bild
sejuma
Vielposter
 
Beiträge: 787
Registriert: 15.07.2009, 17:46
Nach oben

Re: CSS-Menü macht probleme

Beitragvon contraer » 26.04.2010, 17:01

Hallöchen,
hatte ein ähnliches Problem. Ich habe einfach den z-Index des div in dem die Navigation steht mit einem hohen Wert (z.B. 100) belegt. Dadurch konnte ich das Problem lösen.

Mirko
contraer
neu hier
 
Beiträge: 2
Registriert: 26.04.2010, 16:38
Nach oben
Antwort erstellen

Moderatoren: Laus, Moderatoren

Ähnliche Beiträge zu "CSS-Menü macht probleme"

Zurück zu: CSS für Anfänger

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 3 Gäste

Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
Optimized by SEO phpBB, Deutsche Übersetzung durch phpBB.de
cron