Submenu załaniające menu

Wszystko o HTML, XHTML, XML, CSS.
Awatar użytkownika
SKai
Posty: 18
Rejestracja: 20 sty 2014, 14:36:31
Reputacja: 0
Płeć: Niewybrana
User Agent: Firefox Windows

Submenu załaniające menu

Postautor: SKai » 10 lip 2015, 20:00:28

Witam,

tworzę stronę na joomli. Jest to aktualna wersja. Problemem jest submenu, które po rozwinięciu zasłania menu. Właściwie to subsubmenu zasłania submenu, dla jasności.

CodeColon Select All Code

/* NAVIGATION
---------------------------------------------------------------------------- */

#fav-nav {
  
z-index100;
  
positionrelative;
  
floatright;
}
#fav-nav .moduletable {
  
backgroundnone;
  
overflowvisible;
  
margin0;
}
#fav-nav .moduletable ul.nav.menu {
  
float:right;
}
#fav-nav .moduletable ul.nav.menu li,
#fav-nav .moduletable ul.nav.menu li li,
#fav-nav .moduletable ul.nav.menu li li li,
#fav-nav .moduletable ul.nav.menu li li li li {
  
line-height20px;
  
padding-left0;
}
#fav-nav .navigation {
    
margin-top26px;
}
#fav-nav .navigation li a {
  
color#777;
  
padding14px 21px;
  
margin0 0 0 14px;
  
font-size14px;
  -
webkit-border-radius4px;
  -
moz-border-radius4px;
  
border-radius4px;
  -
webkit-transitionall 200ms linear;
  -
moz-transitionall 200ms linear;
  -
o-transitionall 200ms linear;
  
transitionall 200ms linear;
}
#fav-nav .navigation li a:before {
  
contentnone;
}
#fav-nav .navigation .nav-pills > .active > a,
#fav-nav .navigation .nav-pills > li > a:hover,
#fav-nav .navigation .nav-pills > li > a:focus {
  
background-color#0099FF;
    
color#fff;
  
text-decorationnone;
}
.
navigation .nav-pills {
  
margin-bottom0;
}

/* Subnav */

.navigation ul.nav-child {
  
positionabsolute;
  
left10px;
  
z-index1000;
  
displaynone;
  
min-width200px;
  
padding5px 0;
  
margin0;
  list-
stylenone;
  
background-color#222;
  
border1px solid #444;
  
*border-right-width2px;
  *
border-bottom-width2px;
  -
webkit-box-shadow0 5px 10px rgba(0,0,0,0.2);
  -
moz-box-shadow0 5px 10px rgba(0,0,0,0.2);
  
box-shadow0 5px 10px rgba(0,0,0,0.2);
  -
webkit-background-clippadding-box;
  -
moz-background-clippadding;
  
background-clippadding-box;
}
.
navigation ul.nav li {
  
positionrelative;
  
floatleft;
}
.
navigation ul.nav li:hover > .nav-child,
.
navigation ul.nav li a:focus + .nav-child,
.
navigation ul.nav-child li:hover ul {
  
displayblock;
}
#fav-nav .nav-pills ul.nav-child li > ul {
  
margin: -38px 0 0 190px;
  
padding0;
}
.
navigation ul.nav-child a {
  
displayblock;
  
clearboth;
  
color#333;
  
font-size14px;
  
padding3px 20px;
  
font-weightnormal;
  
line-height2em!important;
  
white-spacenowrap;
}
#fav-nav .navigation .nav-pills .nav-child {
  
padding-bottom0;
  -
webkit-border-radius4px;
  -
moz-border-radius4px;
  
border-radius4px;
}
#fav-nav .navigation .nav-pills .nav-child a {
  
margin0;
  
padding4px 20px;
  
font-size14px;
  
border-topnone!important;
  
border-bottom1px solid #444;
}
#fav-nav .navigation .nav-pills .nav-child > .active > a,
#fav-nav .navigation .nav-pills .nav-child > li > a:hover  {
  
text-decorationnone;
  
color#0099ff;
}
.
navigation .nav-child.pull-right {
  
right0;
  
leftauto;
}
.
navigation .nav-child .divider {
  *
width100%;
  
height1px;
  
margin8px 1px;
  *
margin: -5px 0 5px;
  
overflowhidden;
  
background-color#e5e5e5;
  
border-bottom1px solid #fff;
}
.
navigation .nav-child:before {
  
positionabsolute;
  
top: -7px;
  
left9px;
  
displayinline-block;
  
border-right7px solid transparent;
  
border-bottom7px solid #ccc;
  
border-left7px solid transparent;
  
border-bottom-colorrgba(0,0,0,0.2);
  
content'';
}
.
navigation .nav-child:after {
  
positionabsolute;
  
top: -6px;
  
left10px;
  
displayinline-block;
  
border-right6px solid transparent;
  
border-bottom6px solid #777;
  
border-left6px solid transparent;
  
content'';
}
.
navigation .nav-child li ul:before {
  
top10px;
  
left: -7px;
  
border-leftnone;
  
border-bottom7px solid transparent;
  
border-right7px solid rgba(0000.2);
  
border-top7px solid transparent;
}
.
navigation .nav-child li ul:after {
  
top11px;
  
left: -6px;
  
margin-top0;
  
border-leftnone;
  
border-top6px solid transparent;
  
border-right6px solid #777;
  
border-bottom6px solid transparent;


Niestety nie wiem co jest przyczyną. Nie wiem co mogłem przeoczyć nawet.
Awatar użytkownika
piwo
Posty: 673
Rejestracja: 13 lip 2010, 16:13:44
Reputacja: 50
Płeć: Niewybrana
User Agent: Firefox Windows

Re: Submenu załaniające menu

Postautor: piwo » 11 lip 2015, 00:13:06

łatwiej by było jakbyś zapodał adres strony.
{$signature}
Awatar użytkownika
SKai
Posty: 18
Rejestracja: 20 sty 2014, 14:36:31
Reputacja: 0
Płeć: Niewybrana
User Agent: Firefox Windows 1600x900

Re: Submenu załaniające menu

Postautor: SKai » 11 lip 2015, 00:27:51

Wysłałem link do strony na pw.
ZeDD
Posty: 4
Rejestracja: 11 lip 2015, 12:06:10
Reputacja: 0
Płeć: Niewybrana
User Agent: Firefox Windows 1280x1024

Re: Submenu załaniające menu

Postautor: ZeDD » 11 lip 2015, 12:08:02

Nie rozumiem tego. Co byś chciał tutaj zmienić ? Nie możesz podać linka do strony byłoby to prostsze. Ja mogę Ci pomóc o ile podasz tutaj www swoje w całości albo wyślesz mi to w prywatnej wiadomości. Raz się mogę poświęcić bo w końcu tytuł technika informatyka do czegoś zobowiązuję.
Awatar użytkownika
piwo
Posty: 673
Rejestracja: 13 lip 2010, 16:13:44
Reputacja: 50
Płeć: Niewybrana
User Agent: Firefox Windows 1280x1024

Re: Submenu załaniające menu

Postautor: piwo » 14 lip 2015, 05:12:28

@SKai

w pliku templates/favouritedark/css/template.css na samym końcu dodaj

CodeColon Select All Code

.nav-child ul {
    
left100px !important;
    
top10px !important;


Możesz sam dostosować przesunięcie menu tak jak Ci odpowiada najbardziej zmieniając te wartości.
pierwsza wartość 100 określa przesunięcie menu na boki.
druga wartość 10 oznacza przesunięcie menu w pionie.
{$signature}

Wróć do „HTML, CSS”

Kto jest online

Użytkownicy przeglądający to forum: Obecnie na forum nie ma żadnego zarejestrowanego użytkownika i 1 gość