• Hello, I’d like to have the title and description display on top of the header image in the 2016 theme. I have a child theme installed. Can this be done in just css? Any help would be appreciated, thanks!

Viewing 5 replies - 1 through 5 (of 5 total)
  • When you say “title and description display on top of the header”, do you mean that the title and description display with the header image behind them?

    Thread Starter lazyym

    (@lazyym)

    When you say “title and description display on top of the header”, do you mean that the title and description display with the header image behind them?

    Yep!

    This should get you started…

    @media screen and (min-width: 61.5625em) {
    	.site-header {
    		padding: .25em 4.5455%;
    	}
    	.site-branding {
    		position:absolute;
    		top: 1.75em;
    		left: 4.75em;
    	}
    }

    If you’ve set a primary menu, you’ll also need the navigation and menu adjustments I’ve added below.

    @media screen and (min-width: 61.5625em) {
    	.site-header {
    		padding: .25em 4.5455%;
    	}
    	.site-branding {
    		position:absolute;
    		top: 1.75em;
    		left: 4.75em;
    		z-index: 1;
    	}
    	.site-header-menu {
    		position:absolute;
    		top: -2em;
    		left: 4.75em;
    		z-index: 1;
    	}
    	.main-navigation {
    		margin: 0 -0.875em;
    	}
    }
    Thread Starter lazyym

    (@lazyym)

    Very cool! Will try it out eventually and update my results. Still somewhat a novice that I am, I noticed in a previous css attempt that it displayed the menu on top of other items. I’ll give this a shot!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘How to put title & description on TOP of header image?’ is closed to new replies.