Almenük előkotrása a háttérből

Archívum 2006-2018.11.09 sablonok-grafikak
#1

Sziasztok,



Csináltam aktív menüket meg lehulló almenüket egy olyan sablonhoz, amihez gyárilag nem volt, de egyszerűen nem tudom elővakerálni a body mögül. Már egy órája alakítgatom a css-t, mindegyik részét, de egyszerűen nem megy - a háttérben ott van, de nem tudom előrehozni.



Megnézné valaki esetleg?



http://refkassa.sk



A KÖZÖSSÉG menüponthoz vannak almenük rendelve.



Köszönöm!

#2

Szia! Nézem neked.

#3

A CSS-ben a “#menu ul ul”-hez vegyél fel egy “z-index: 100;”-at. Így elsőre.

#4

Köszönöm, a z-indexxel már próbálkoztam - nem ment. De kipróbáltam még egyszer - és nem. :frowning:

#5

És ha !important…? Nem írja felül valami örökölt tulajdonság lejjebb?

#6

Így jó lesz:

/* MENU */<br />
<br />
#menu{<br />
width:100%;<br />
height:50px;<br />
<br />
}<br />
<br />
#menu li {<br />
float: left;<br />
position: relative;<br />
line-height: 54px;<br />
}<br />
#menu li a {<br />
float: left;<br />
display: block;<br />
padding: 0 15px;<br />
color: #ffffff;<br />
font-size: 12px;<br />
font-weight:bold;<br />
text-transform: uppercase;<br />
text-decoration:none;<br />
}<br />
#menu li a:hover{<br />
background: #b40e12;<br />
color: #fff;<br />
}<br />
<br />
#menu ul ul {<br />
box-shadow: 0px 3px 3px rgba(0,0,0,0.2);<br />
-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);<br />
-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);<br />
display: none;<br />
position: absolute;<br />
top: 38px;<br />
left: 0;<br />
float: left;<br />
width: 180px;<br />
z-index: 99999;<br />
}<br />
#menu ul ul li {<br />
min-width: 180px;<br />
}<br />
#menu ul ul ul {<br />
left: 100%;<br />
top: 0;<br />
}<br />
#menu ul ul a {<br />
background: #333;<br />
line-height: 1em;<br />
padding: 10px;<br />
width: 160px;<br />
height: auto;<br />
}<br />
#menu li:hover > a,<br />
#menu ul ul :hover > a {<br />
background: #333;<br />
color: #fff;<br />
}<br />
#menu ul li:hover > ul {<br />
display: block;<br />
}<br />
#menu ul li.current_page_item > a,<br />
#menu ul li.current_page_ancestor > a,<br />
#menu ul li.current-menu-ancestor > a,<br />
#menu ul li.current-menu-item > a,<br />
#menu ul li.current-menu-parent > a {<br />
color: #fff;<br />
}<br />
* html #menu ul li.current_page_item a,<br />
* html #menu ul li.current_page_ancestor a,<br />
* html #menu ul li.current-menu-ancestor a,<br />
* html #menu ul li.current-menu-item a,<br />
* html #menu ul li.current-menu-parent a,<br />
* html #menu ul li a:hover {<br />
color: #fff;<br />
}
#7

Egyébként a gond ez volt:

#menu{

width:100%;

height:50px;

overflow:hidden;

}


overflow:hidden; miatt levágta a kilógó részeket a menu div-ből.
#8

kipróbálom így is.



még mindig nem… :frowning:

#9

Tegyél a <div id=“body”> fölé egy ilyet:




És akkor nem fog összetolódni a két div.
#10

Na, sikerült !!!



Köszönöm szépen!



Az overflow-val én is próbálkoztam, de szétdobta az oldalt,ahogy láttad is, a clear:both segített, mostmár tudom, hogy ez “rendet rak” a divek között.



Köszönöm a segítséget, mindkettőtöknek!

#11

Szuper! :slight_smile:

#12

Ha ez segít, akkor érdemes létrehozni egy “clear” osztályt css-ben, én legalábbis így szoktam.

.clear { clear: both; }
```<br />
Ezután már csak az osztályt kell meghívnod a megfelelő helyeken HTML-ben:<br />
```
Ill. XHTML-ben:
```
```