CSS Mega Menu hover od połowy przycisku


(Kernelus) #1

Witam,

Posiadam takie css menu, oto strona: http://gracja.worldbit.pl

Mam taki problem, że jak najedzie się na "Oferta" i potem najedzie się na pierwszy rozwijany element, jest to "Świat masażu i refleksoterapii" To hover pojawia się dopiero od połowy tego przycisku i link do tej podstrony. Wie ktoś może o co chodzi? Jest tak tylko z tymi przyciskami, które mają rozwijaną listę.

Oto css przycisków:

ul {

    font-family: "Trebuchet MS",Arial,Helvetica,sans-serif;

    font-size: 18px;

    line-height:24px;

    margin: 0;

    padding: 0;

    list-style: none;

}


ul li { display: block; position: relative; float: left;margin-right:20px; }

li ul { display: none; }


ul li a {

    display: block;

    color: #800080;

    text-decoration: none !important;

    border-radius:10px;

    padding: 5px 5px 5px 5px;

    margin-left: 1px;

    white-space: nowrap;

}


ul li:hover a { background-image: linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);

background-image: -o-linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);

background-image: -moz-linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);

background-image: -webkit-linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);

background-image: -ms-linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);


background-image: -webkit-gradient(

	linear,

	left bottom,

	left top,

	color-stop(0.41, rgb(28,28,28)),

	color-stop(0.5, rgb(71,71,71)),

	color-stop(1, rgb(71,71,71))

);

color:#ffffff;

cursor:pointer;

cursor:hand; }

li:hover ul { display: block; position: absolute; }

li.submenu a { width:290;font-size:14px;color:#ffffff;cursor:pointer;cursor:hand;}

li.submenu2 a { width:290;font-size:14px;color:#ffffff;cursor:pointer;cursor:hand;}

li.submenu ul li a{font-size:12px;color:#ffffff;width:255px;}

li.submenu ul li.sub2 a{font-size:12px;color:#ffffff;width:155px;}

li.submenu2 ul li.sub3 a{font-size:12px;color:#ffffff;width:245px;}

li.submenu2 ul li.sub4 a{font-size:12px;color:#ffffff;width:195px;}

li.submenu2 ul li.sub5 a{font-size:12px;color:#ffffff;width:185px;}

li.submenu2 ul li.subsub ul li {display:none;}

li.submenu2 ul li.subsub ul li a{font-size:12px;color:#ffffff;width:125px;}

li.submenu2 ul li.subsub:hover ul li {display: block; position: relative;left:206px;}

li.submenu2 ul li.subsub a{font-size:12px;color:#ffffff;width:195px;}

li.submenu ul { display: none; width:100px; }

li.submenu:hover ul { display: block; position: absolute; top:0px;cursor:pointer;cursor:hand;}

li.submenu ul li { position: relative; left: 294px; }

li.submenu ul li a { display: block; }

li.submenu2 ul { display: none; width:100px; }

li.submenu2 ul li { position: relative; left: 294px; }

li.submenu2:hover ul { display: block; position: absolute; bottom:0px;cursor:pointer;cursor:hand;}

li.submenu2 ul li a { display: block; }



li:hover li { float: none; font-size: 11px; }

li:hover a { background-image: linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);

background-image: -o-linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);

background-image: -moz-linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);

background-image: -webkit-linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);

background-image: -ms-linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);


background-image: -webkit-gradient(

	linear,

	left bottom,

	left top,

	color-stop(0.41, rgb(28,28,28)),

	color-stop(0.5, rgb(71,71,71)),

	color-stop(1, rgb(71,71,71))

); }

li:hover li a:hover { background:#1c1c1c; }


ul li a.current { background-image: linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);

background-image: -o-linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);

background-image: -moz-linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);

background-image: -webkit-linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);

background-image: -ms-linear-gradient(bottom, rgb(28,28,28) 41%, rgb(71,71,71) 50%, rgb(71,71,71) 100%);


background-image: -webkit-gradient(

	linear,

	left bottom,

	left top,

	color-stop(0.41, rgb(28,28,28)),

	color-stop(0.5, rgb(71,71,71)),

	color-stop(1, rgb(71,71,71))

);

color:#ffffff; }

a tutaj html: