开发者

In this horizontal menu only for last dropdown i want to keep inside

开发者 https://www.devze.com 2023-01-06 06:51 出处:网络
http://www.lwis.net/free-css-drop-down-menu/dropdown.simple.horizontal.html Right last item\'s dropdown goes outside the menu

http://www.lwis.net/free-css-drop-down-menu/dropdown.simple.horizontal.html

Right last item's dropdown goes outside the menu

alt text http://shup.com/Shup/374936/开发者_Python百科110621146-My-Desktop.png

I need only last last item's submenu inside.

like this alt text http://shup.com/Shup/374939/1106211810-My-Desktop.png


Firstly, you might want to consider positioning your main menu li's relatively. Then the drop down ul's which are positioned absolutely will appear underneath their corresponding li by default. Like this for example:

ul.dropdown li {
    position: relative;
}

Then you can simply add a new class to the last <li class="dir"> which gets its own styling to change the position of the last dropdown menu. Something like this for example:

HTML:

<li class="dir last">

CSS:

li.last ul {
    left: -50px; /* or however much you need for it to appear where you want it to */
}


You'll need to set the right position for that particular list i.e.

<li class="dir"><a href="./">Contact Us</a>
        <ul style="last-menu">
            <li><a href="./">Enquiry Form</a></li>
            <li><a href="./">Map &amp; Driving Directions</a></li>
            <li><a href="./">Your Feedback</a></li>
        </ul>
    </li>

<style>
  .last-menu{
    right: 0px;
  }
</style>
0

精彩评论

暂无评论...
验证码 换一张
取 消