+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: Początkujący webmaster (https://www.webmastertalk.pl/forum-poczatkujacy-webmaster)
+--- Wątek: Problem z css w Chrome (/thread-problem-z-css-w-chrome)
Problem z css w Chrome - hexel - 04-04-2011
Witam,
kochani, walczę z tym już parę ładnych dni i jeśli nie będzie ktoś łaskaw mi z tym odrobinę pomóc, nie dam sobie rady. Postawiłem joomle 1.6 i próbuję dostosować do swoich potrzeb gotowy template. Chodzi o rozwijane menu na stronie głównej. Kod css wygląda tak:
/* Drop-down menu */
.ulwrapper {
display: none;
position: absolute;
padding:15px 0 0 0;
z-index:350;
margin:69px 0 0 -17px !important;
left:0;
top:0;
zoom:1;
width:100%;
background:url(../images/drop_bg.png) 0 0 no-repeat;
width:199px
}
.footer .ulwrapper, .first .ulwrapper {
display: upper;
position: absolute;
padding:15px 0 0 0;
z-index:350;
left:0;
top:-440px;
zoom:1;
width:100%;
margin:69px 0 0 -17px;
background:url(../images/drop_bg.png) 0 -12px no-repeat;
padding:0;
width:199px;
}
.ulwrapper .ulwrapper {
left:100%;
top:0px;
margin:0 !important;
background:url(../images/drop_bg.png) 0 -12px no-repeat;
padding:0
}
.ulwrapper ul{ padding:0 0 3px 0 !important; margin:0 !important; position:relative; width:199px}
.ulwrapper ul li{ list-style:none;}
.parent .ulwrapper ul li, .parent .ulwrapper ul li a, .parent .ulwrapper ul li a strong{
float:none ;
height:auto ;
color:#fff ;
font-size:14px;
font-weight:normal ;
background:none ;
text-transform:uppercase;
width:199px
}
#body .parent .ulwrapper ul li a, #body .parent .ulwrapper ul li a strong {
}
#body .parent .ulwrapper ul li a:hover, #body .active_tab2 > a strong, .active > a {
color:#fff ;
background:#5bd0ff
}
.parent .ulwrapper ul li {
}
.parent .ulwrapper ul li a strong{ padding:14px 0 12px 0 !important; display:block !important; font-weight:normal !important;height:1%; text-align:left !important; font-size:14px}
.ulwrapper ul li a{ padding: 0 !important; background:none !important}
.ulwrapper ul li a:hover, .ulwrapper ul li.active > a{ color:#fff !important; display:block; background:#6d1212 !important}
.ulwrapper ul li a:hover strong{ color:#fff !important; font-weight:normal !important;}
/* EOF Drop-down menu */
Problem jest w :
display: upper;
ja wiem, że coś takiego jak upper
nie istnieje. Ale tylko z takim parametrem menu rozwija się prawidłowo w FF i IE, ale nie pod chrome. Rozwija się prawidłowo tzn. po wejściu na stronę nie jest rozwinięte, tylko uaktywnia się po najechaniu myszką na menu. Jeśli dam np. inline-block, albo block to w każdej przeglądarce menu się wyświetla zaraz po wejściu na stronę jako rozwinięte. Ale pod chrome jak najadę na menu myszką i później zjadę poza jego obszar menu już się nie uaktywni. W ie i FF się uaktywnia nawet po najechaniu i zjechaniu (tylko, że jest już rozwinięte zaraz po wejściu na stronę).
Chciałbym uzyskać taki efekt, żeby we wszystkich przeglądarkach IE, FF i Chrome menu nie rozwijało się zaraz po wejściu na stronę, tylko po najechaniu na pozycję menu. Próbowałem już z różnymi parametrami:
block, inline, none, table, inherit.
Bardzo przepraszam, jeśli coś niejasno lub źle opisałem. Uczę się dopiero całego zagadnienia, potrzebne mi to do szkoły na informatykę.
Jeśli ktoś będzie mógł coś mi pomóc będę bardzo wdzięczny.
Z góry dziękuję