Header & Menu questions (3 posts)

  1. Silja-Jonsson
    Posted 3 years ago #


    I'm in the need of some help here. I love working/learning the CSS system but now and than I bump into small problems. I have two now... I'm working with the new Twenty Twelve theme and my website is

    Problem #1:
    I would like to 'correct' the header option for my website. I would like to be able to only have the header on one site (front page) and than be without the header on all the other pages. Is this possible, any ideas on how I can solve it? Below are links to show ya'll how I want it to look in the end..

    Photo nr. 1 (front page):
    Photo nr. 2 (other pages):

    Problem #2:
    I have a minor problem with the menu. I'm not sure how I should describe it so please take a look at the photo below. I would like to get the 'sites' circled (in red by my hand) in the same color when I have the arrow pointed on a sub-menu. I've only been able to make the hover colored pink, but I would like the ancestor to be the same color. Hopefully I made some sense?


    These are the codes I have for the menu right now:

    .main-navigation ul.nav-menu,
    	.main-navigation div.nav-menu > ul {
    		border-bottom: 1px solid #ededed;
    		border-top: 1px solid #ededed;
    		display: inline-block !important;
    		text-align: center;
    		width: 100%;
    	.main-navigation ul {
    		margin: 0;
    		text-indent: 0;
    	.main-navigation li a,
    	.main-navigation li {
    		display: inline-block;
    		text-decoration: none;
    	.main-navigation li a {
    		border-bottom: 0;
    		color: #000000;
    		line-height: 3.692307692;
    		text-transform: uppercase;
    	.main-navigation li a:hover {
    		color: #c24050;
    	.main-navigation li {
    		margin: 0 40px 0 0;
    		margin: 0 2.857142857rem 0 0;
    		position: relative;
    	.main-navigation li ul {
    		display: none;
    		margin: 0;
    		padding: 0;
    		position: absolute;
    		top: 100%;
    		z-index: 1;
    	.main-navigation li ul ul {
    		top: 0;
    		left: 100%;
    	.main-navigation ul li:hover > ul {
    		border-left: 0;
    		display: block;
    	.main-navigation li ul li a {
    		background: #efefef;
    		border-bottom: 1px solid #e3e3e3;
    		display: block;
    		font-size: 11px;
    		font-size: 0.785714286rem;
    		text-align: left;
    		line-height: 2.181818182;
    		padding: 8px 10px;
    		padding: 0.571428571rem 0.714285714rem;
    		width: 180px;
    		width: 12.85714286rem;
    	.main-navigation li ul li a:hover {
    		color: #c24050;
    	.main-navigation .current-menu-item > a,
    	.main-navigation .current-menu-ancestor > a,
    	.main-navigation .current_page_item > a,
    	.main-navigation .current_page_ancestor > a {
    		color: #c24050;
    	.menu-toggle {
    		display: none;
  2. Silja-Jonsson
    Posted 3 years ago #

    Strange, the links didn't come in...

    Website: http://jonssonsstockdogs.com/

    Photo nr. 1 (front page): http://jonssonsstockdogs.com/front-page.jpg
    Photo nr. 2 (other pages): http://jonssonsstockdogs.com/other-pages.jpg

    Photo (menu): http://jonssonsstockdogs.com/menu.jpg

  3. esmi
    Forum Moderator
    Posted 3 years ago #

    Do not edit the Twenty Twelve theme. It is the default WordPress theme and having access to an unedited version of the theme is vital when dealing with a range of site issues. First create a child theme for your changes.

Topic Closed

This topic has been closed to new replies.

About this Topic