AllThatsHealing

Thanks so much for that – Much appreciated!
Managed to get the errors down to 7. They mostly relate to the font elements in the text widget and accuse me of not using CSS instead ??

Not sure if it’s the right thing to do, but I resorted to brute force ??

.main-navigation ul.nav-menu {
    background: none repeat scroll 0 0 #fff;
    padding: 0 0 0 100px;
}

What I’d really like to do is to move it up so the bottom of the menu is level with the base of the tree logo.

Would love you to look at it later, if you could. I’ll have a play with it in the mean time & see what I manage to resolve. The media query thingy is new to me so I might go get acquainted with that first ??

Brilliant, WPYogi! That fixed it!!

So now if I want to move the menu to a certain position (in technical terms: to the right a bit and up a tad), do i do that in the style.css or still in header.php?

Oops, posted that before I saw your reply. I’ll try that, WPyogi. Thanks!

Thought I might give a running update as I go ??

I just copied the masthead code from another website I made and pasted it into this one. The submenu works in the other site in IE but it still doesn’t in this one. Could it be some kind of clash with the code & the layout of my header? I deactivated the few plugins I have and it didn’t help. Below is the full code in my child theme’s style.css (which includes the masthead code which is messing up IE)

/*
Theme Name:     2012CHILD
Theme URL:      https://allthatshealing.com.au/
Template:       twentytwelve
*/

@import url("../twentytwelve/style.css");

/*move main menu below header*/
#masthead {position: relative;}
#site-navigation {
    position: absolute;
    top: 190px;
    left: 200px;
}

/*remove image borders*/
.entry-content img,
.comment-content img,
.widget img,
img.header-image,
img.wp-post-image {
    border-radius:0;
    box-shadow:0 0 0 rgba(0,0,0,0);
}

/*remove white space above header*/
.main-navigation {
    margin-top: 0;
    text-align: center;
}

/*remove page titles*/
.page .entry-title { display: none; }

/*remove proudly supported by*/
.site-info {   display: none;}

/*remove white space between body content and menu*/
.site-content {
margin-top: -20px !important;
}

/*increase width of page*/
.site {
    margin: 0 auto;
    max-width: 72.5714rem;
    overflow: hidden;
}

/*reduce margin at top of page*/
body .site {	margin-top: 1.5rem;
		margin-bottom: 1rem;
		box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
	}

/*FONTS*/
.main-navigation li a:hover {
color: #0da71c;
}
.main-navigation li a {
color: #000000;
}

/*Add 3 column footer widgets. NB: add footer.php file to child theme*/
.widget-area .widget h3 {
  margin-bottom:0;
}

#footerwidgets {
 width:100%;
}
#footerwidgets p {
 padding-bottom: .5em;
}
#footerwidgets li, #footerwidgets p  {
 padding-bottom: .5em;
 font-size:80%;
 line-height:1.1em;
}
#footer-left {
 width:30%;
 float:left;
 padding-right:2.5%;
}
#footer-middle {
 width:28%;
 float:left;
 padding-left:4%;
 padding-right: 2%;
}
#footer-right {
 width:30%;
 float:right;
 padding-left:3%;
}

Ahah! Worked it out! It was my code to move the main menu below the header. Can someone tell me what’s wrong with it?

#masthead {position: relative;}
#site-navigation {
    position: absolute;
    top: 190px;
    left: 200px;
}

Thanks for all the suggestions. I deactivated my child theme & used the original twenty-tweleve style.css & the submenu in IE worked like a dream! Now gotta go work out what I’ve messed up in my child theme’s css that IE doesn’t like ??

Thanks for the answer, leejosepho. I’m surprised there aren’t more on this forum posting about the same problem. I searched before posting my cry for help but couldn’t find any ??

I tried the code as is but it didn’t work. Or am I meant to edit your custom code to suit? I’m not great at css so if anyone can help, you’ll be my hero!