How do I remove white space under nav bar?

Post here the code you have tried.

This is all I have in my CSS. I have tried changing the padding on everything I could find with a value. I also changed the single entry styles. Basically the same stuff that’s in the forum. Sorry I can’t be more specific, but I have tried and deleted so many.

/*
Theme Name: sendell
Description: twentyeleven child
Author: Moore Design Graphics
Template: twentyeleven
*/

@import url(“../twentyeleven/style.css”);

.page-id-4 .entry-title { display: none; }
.page-id-2 .entry-title { display: none; }
.page-id-24 .entry-title { display: none; }
.page-id-22 .entry-title { display: none; }
.page-id-5 .entry-title { display: none; }

#branding #searchform {
display: none;
}

#branding {border-top: 0;}

#access {
background:none repeat scroll 0 0 #FFFFFF;
color:#000000;
box-shadow: none;
clear: both;
display: block;
text-align: center;
margin: 0 auto 6px;
width: 100%;
}
#access ul {
font-size: 13px;
list-style: none;
margin: 0 0 0 -0.8125em;
padding-left: 0;
display: inline-block;
text-align: center;
}
#access li {
text-align:center;
position: relative;
}
#access a {
color: #333;
display: block;
line-height: 3.333em;
padding: 0 1.2125em;
text-decoration: none;
}
#access ul ul {

display: none;
text-align:center;
margin: 0;
position: absolute;
top: 3.333em;
left: 0;
width: 188px;
z-index: 99999;
}
#access ul ul ul {
left: 100%;
top: 0;
}
#access ul ul a {
background: #f9f9f9;
border-bottom: 1px dotted #ddd;
color: #666;
font-size: 13px;
font-weight: normal;
height: auto;
line-height: 1.4em;
padding: 10px 10px;
width: 168px;
}
#access li:hover > a,
#access ul ul :hover > a,
#access a:focus {
background: #FFF;
}
#access li:hover > a,
#access a:focus {
background: none;
color: #666;
}
#access ul li:hover > ul {
display: block;
}
#access .current-menu-item > a,
#access .current-menu-ancestor > a,
#access .current_page_item > a,
#access .current_page_ancestor > a {
font-weight: bold;
}

body {
font-size: .7em;
text-align: center;
}

/* IPAD FIXES */
@media (max-width: 960px) {
/* Simplify the basic layout */
#main #content {margin: 2em auto;}

@media (max-width: 960px) {
/* @media (max-width: 960px) Reduce font-sizes for better readability on smaller devices */
body, input, textarea {}

img.alignleft { margin-right:10px; }

When working in Child Themes, the idea is to create styles that override the parent theme. That’s probably why you haven’t succeeded in modifications to your Child Theme stylesheet.

Use a tool like Google Chrome’s Inspector to find which CSS is applying padding to which elements.

Then define new styles in your Child Theme to override these padding styles. I.e

.class {
 padding: 0;
}

<div class=”menu”>

<li class=”current_page_item”>Home<li class=”page_item page-item-2″>About<li class=”page_item page-item-24″>Contact<li class=”page_item page-item-22″>Portfolio<li class=”page_item page-item-59″>Testimonials<li class=”page_item page-item-5″>Services

</div>

This is the code from the page. It calls the nav bar class=menu, but I don’t find any .menu styles in the native twentyeleven CSS to change or override.

Look for margins and other elements (such as the main <div> and <article> element) too.

.singular.page .hentry {
padding:0;
}

Changing padding to 0 (above) took some space out of Safari using Firebug, but when I added that to the child CSS there was no difference.

I’m not seeing it in your child theme stylesheet
https://www.sendelldesigngroup.com/wp-content/themes/sendell/style.css

Did you remove it?

I just added it along with some other style changes that haven’t worked. I think it may have something to do with <article id=”post-4″ class=”post-4 page type-page status-publish hentry”> but I’m not sure what.

Have you removed it again?

Try using more specific CSS selectors.
E.g

#main .singular.page .hentry {
 padding:0;
}

The main div looks like a blank space holder. Not sure if I could delete it or comment it out of the php file…

Probably not a good idea as it contains the entire page content… But it does have top padding that you want to get rid of.

The padding in that area is coded into 4 places in the regular CSS file –lines 754, 1086, 1091 and 684.

Thanks WPyogi. I just added all of the code above into my child CSS and changed the padding value to 0, but nothing moved. Any other ideas?

Your CSS changes aren’t saving properly.

That’s what I was thinking. I am making changes in the style sheet and clicking update. I am using Safari on a Mac. Should I try a different browser? Thanks for your help. I am so close to finishing this and it just doesn’t look right with the big white gap!

Looks like however you entered it, it contains an error — see line 161 on that stylesheet:

https://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.sendelldesigngroup.com%2F&profile=css3&usermedium=all&warning=1&vextwarning=&lang=en