Welcome Guest, Not a member yet? Register   Sign In
CSS Expert? Need a second pair of eyes on this...
#1

I'm playing around with bootstrap 4 (yes, it's alpha), but my CSS issue really doesn't have anything to do with bootstrap.

See: http://suvovu.com

Under the "My Account" menu item, if using a screen with width > 768px, there is a submenu that you can't see. It's an absolutely positioned element. I want to see it. Why can't I see it?

Menu is basic nested list:


Code:
<nav id="menu">
    <ul>
        <li>
            <a href="#"><i class="fa fa-chevron-right"></i>Home</a>
        </li>
        <li>
            <a href="#"><i class="fa fa-chevron-right"></i>Service</a>
        </li>
        <li>
            <a href="#"><i class="fa fa-chevron-right"></i>Maintenance</a>
        </li>
        <li class="submenu">
            <button type="button" id="sub-menu-toggle">
                My Account<i class="fa fa-caret-down"></i>
            </button>
            <ul>
                <li>
                    <a href="#"><i class="fa fa-chevron-right"></i>Sign In To Access Awesome</a>
                </li>
                <li>
                    <a href="#"><i class="fa fa-chevron-right"></i>Register</a>
                </li>
            </ul>
        </li>
        <li>
            <a href="#"><i class="fa fa-chevron-right"></i>Contact</a>
        </li>
    </ul>
</nav>

CSS is a little too much to post here, but being that it's a responsive design, and was designed mobile first, I've done everything that should be necessary to see the submenu. Just can't see it. CSS:

http://suvovu.com/css/style.1494535584.css

If anyone can help, I'd appreciate it.
Reply
#2

(This post was last modified: 05-11-2017, 03:00 PM by Martin7483.)

Code:
#header nav#menu {
    overflow: hidden;
}

Remove the overflow hidden Smile
Reply
#3

(05-11-2017, 02:58 PM)Martin7483 Wrote:
Code:
#header nav#menu {
    overflow: hidden;
}

Remove the overflow hidden Smile

Thank you!
Reply




Theme © iAndrew 2016 - Forum software by © MyBB