Now that you know how to add background images and color in Thesis 2.1, the next thing I want to do is style the Thesis Classic Responsive menu.
Change Background Color
Your first inclination might be to remove the border from the menu but what I’m going to do is just change the border color so that it’s the same color as the main menu background and then I want that color to span all the way across.
The first thing to do in order to make it that color is get the site background color, cccc5e. Although it’s also the interior backgrounds color so we’re going to use that one in your backgrounds rather than the site background in our thing. We go to Custom CSS and header, come down here and say .menu, background-color, pick it and background color, close the bracket out. So now, our background color should stretch all the way across, it does.
Change Border Color
Then I’m going to make the border that color as well and I’ve got a snippet here for you that’ll make this a little bit easier because you could get rid of the border, right? You could say .menu and then .menu a border:none. I’m actually going to make it .menu a with this border color specifically because I want to retain the border in the responsive menu. So all I’m going to do here is change the border color so that it matches and again, not using that color but instead, color 2. Save Custom CSS, refresh it, okay and now we have a menu that spans all the way across and that has an accent color.