Comments on: How To Start Working With Underscores (_s) As A Beginner WP Developer

By: editorial

editorial — Tue, 18 Sep 2018 11:46:09 +0000

In reply to Cindy.

Not 100% sure why but might have something to do with the usage of HTML5 main element. They don’t want it on the same hierarchy level as header and footer elements. Technically it should be on the same level but because of older browsers ( main was added later on in IE ) they decided to have the whole thing wrapped in a div.

By: Cindy

Cindy — Sat, 18 Aug 2018 00:33:18 +0000

Hey, I’ve been cruising the web tryinig to learn why _u has two divs around the content area — the div with the content-area class and the div with the site-main class. Do you know?

By: editorial

editorial — Tue, 03 Jul 2018 22:56:27 +0000

In reply to maxson mcdowell.

Happy to hear it’s resolved and thanks for sharing the solution.

By: maxson mcdowell

maxson mcdowell — Tue, 26 Jun 2018 18:11:31 +0000

In reply to editorial.

Hi, thanks for your reply.
I have found a solution, but here is my url jungny.com

here is the solution someone else provided: (supplementary css)

.main-navigation ul ul a {
width: 140px;
}
.main-navigation ul ul li:hover > ul, .main-navigation ul ul li.focus > ul {
left: 166%;
}

This works fine and gives me control over the width of drop downs.
Best, max mcdowell

By: editorial

editorial — Tue, 26 Jun 2018 17:19:04 +0000

In reply to Chris.

In Underscores the mobile menu drop down is not absolutely positioned. Can you send over the URL to the website so I can see what’s going on in there.

By: editorial

editorial — Tue, 26 Jun 2018 17:14:00 +0000

In reply to Max Mcdowell.

Can you send over the URL to the website, need to see the issue to figure out the solution.

By: Chris

Chris — Sun, 24 Jun 2018 18:09:13 +0000

I have a question regarding the nav too. In both _u and _s, the mobile menu floats left and the drop downs on mobile devices are positioned absolutely under their respecitve parent nav element – it’s not usable as is. I’m not sure how to modify the existing css/js for nested accordion navs? Anyone else dealing with this?

By: Max Mcdowell

Max Mcdowell — Sun, 27 May 2018 06:03:04 +0000

Hi, I’m a newbie using the built in CSS editor to tweak a version of Underscores theme.
My menu is a horizontal drop-down, 3 levels.
When I reduce the width of the 2nd- and 3rd-level lists a gap appears between them.
How do I modify the CSS to keep the 3rd-level list adjacent to the 2nd-level list?
Your advice much appreciated!

This is the width value I am reducing:
.main-navigation ul ul a {
width: 200px;}

This is the menu css section:

## Menus
————————————————————–*/
.main-navigation {
clear: both;
display: block;
float: left;
width: 100%;
}

.main-navigation ul {
display: none;
list-style: none;
margin: 0;
padding-left: 0;
}

.main-navigation ul ul {
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
float: left;
position: absolute;
top: 100%;
left: -999em;
z-index: 99999;
}

.main-navigation ul ul ul {
left: -999em;
top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
left: 100%;
}

.main-navigation ul ul a {
width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
left: auto;
}

.main-navigation li {
float: left;
position: relative;
padding:4px 8px;
}

.main-navigation li li{
background-color:#ccc;
}

.main-navigation a {
display: block;
text-decoration: none;
color:#000000;
}