Nu se vad submeniurile

Aici postaţi orice este legat de tehnologiile "client side". HTML, HTML5, XHTML, CSS, CSS3, XML, Standarde
Manual JS: http://www.phpromania.net/jsmanual/index.html

Moderatori: eyecon, Moderatori

r4zvy
Average Member
Mesaje: 65
Membru din: Vin Ian 21, 2011 11:09 am

Nu se vad submeniurile

Mesajde r4zvy » Mar Feb 24, 2015 11:56 am

Salut,

Am o problema la meniu, submeniurile nu se vad, doar daca dau o anumita inaltime la header. Altfel nu imi ies sub header.

html

Cod: Selectaţi tot

<div class="header">
   <div class="header-resize">
   <div class="clr"></div>
      <div class="logo"><h1><a href="index.html"><img src="images/logo.png" width="100%" height="auto"/></a></h1></div>
   <div class="clr"></div>
      <div class="menu_nav">
        <ul id="meniu">
    <li class="active"> <a href="index.html">Acasa</a> </li>
    <li> <a href="#">Companie &#9662;</a>
      <ul>
        <li> <a href="#">Istoric</a> </li>
        <li> <a href="#">Parteneri</a> </li>
      </ul>
    </li>
    <li> <a href="#">Productie &#9662;</a>
      <ul>     
        <li> <a href="#">Folii</a> </li>
        <li> <a href="#">Stoc</a> </li>       
      </ul>     
    </li>
    <li> <a href="#">Laborator</a> </li>
   <li> <a href="#">Imagini</a> </li>
   <li> <a href="#">Contact</a> </li>
  </ul>
        </div>
   </div>
</div>


css

Cod: Selectaţi tot

#meniu {
   list-style: none;
   margin: 0px auto;
   padding: 0;
   font-size: 14px;
   float: left;
   position: relative
}

#meniu li
{
   float: left;
   position: relative;
}

#meniu li a
{   
   display: block;
   padding: 10px;
   text-decoration: none;
   color: #fff;
   text-transform: uppercase;   
}

#meniu li:hover a
{
   background:url(images/hover.jpg);
   color: #fff;   
}

#meniu li.active
{
   background:url(images/active.jpg) repeat-x;
}

#meniu ul
{
   display: none;
}

#meniu li:hover ul
{
   display: block;
}

#meniu ul
{
   float: none;
   position: absolute;
   list-style: none;
   margin: 0;
   padding: 0;
   top: 15px;
   left: 0;
   background:none;   
}

#meniu ul li
{
   float: left;
   clear: none;
   margin: 0;
   padding: 0;
   min-width: 150px;
   color: #000;
}

#meniu li:hover ul li a
{
   line-height: 100%;
   display: block;
   padding: 0 6px 0 0;
   float: none;
   color: #000;
   background:none;
}

#meniu li:hover ul li a:hover,
#meniu ul li a:hover
{
   background: none;
   color: #fff;
   
}

#meniu li:hover ul li a,
#meniu ul li a
{
   line-height: 190%;
}

#meniu ul
{
   top: 2.9em;
   z-index:10;
}
Ultima oară modificat Mie Feb 25, 2015 12:39 pm de către r4zvy, modificat 1 dată în total.



beng
Junior Member
Mesaje: 34
Membru din: Mar Noi 12, 2013 7:15 pm
Localitate: Bucuresti
Contact:

Re: Nu se vad submeniurile

Mesajde beng » Mie Feb 25, 2015 10:08 am

Da si tu un link, ceva, ca aici nu ai tot css-ul si nu stim ce reguli i-ai dat header-ului. Un link ar fi foarte bun pt ca putem noi sa facem direct inspect pe sursa.

r4zvy
Average Member
Mesaje: 65
Membru din: Vin Ian 21, 2011 11:09 am

Re: Nu se vad submeniurile

Mesajde r4zvy » Mie Feb 25, 2015 12:40 pm

beng scrie:Da si tu un link, ceva, ca aici nu ai tot css-ul si nu stim ce reguli i-ai dat header-ului. Un link ar fi foarte bun pt ca putem noi sa facem direct inspect pe sursa.

http://testrazvan07.comxa.com/

beng
Junior Member
Mesaje: 34
Membru din: Mar Noi 12, 2013 7:15 pm
Localitate: Bucuresti
Contact:

Re: Nu se vad submeniurile

Mesajde beng » Joi Feb 26, 2015 10:46 am

Daca tot ai inclus libraria de bootstrap, personal ti-as recomanda ca sa folosesti modelul de aici (http://www.w3schools.com/bootstrap/tryi ... &stacked=h) insa va mai trebui ca sa mai adaugi tu dupa importarea css-ului din bootstrap

Cod: Selectaţi tot

.dropdown:hover .dropdown-menu {
    display: block;
}


Referitor la ce ai facut deja, ca sa se vada meniul va trebui ca sa renunti la

Cod: Selectaţi tot

overflow: hidden
din .menu_nav, sa adaugi

Cod: Selectaţi tot

background:url('http://testrazvan07.comxa.com/images/meniu.jpg') repeat-x ;
        width: 100%;
la #meniu si eventual un

Cod: Selectaţi tot

background-color: white;
la #meniu li:hover ul.
De aici vei mai avea doar de stilizat un pic dropdown-ul si active-ul.

Spor!


Înapoi la “HTML/JavaScript/CSS”

Cine este conectat

Utilizatori ce ce navighează pe acest forum: Niciun utilizator înregistrat și 40 vizitatori