16 to 9 – header image across site

Community Forums Forums Design Tips and Tricks 16 to 9 – header image across site

This topic is: not resolved

This topic contains 6 replies, has 2 voices, and was last updated by  bigbyte 9 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #68991

    bigbyte
    Participant
    Post count: 4

    I want to put a banner type header image above my website.

    Here is a raw mock-up.

    http://colorunner.com
    #69072

    Sridhar Katakam
    Participant
    Post count: 923
    #69185

    bigbyte
    Participant
    Post count: 4

    That’s a good start. Thank you. I got the widget piece to work, but ideally I would like to put an image there that goes completely from the edge of the left column to the one on the right. Is that possible?

    #69278

    Sridhar Katakam
    Participant
    Post count: 923

    Yes.

    Add this CSS in extra:

    .content {
    	padding-top: 0;
    	padding-left: 0;
    	padding-right: 0;
    }
    
    .home .entry {
    	padding-left: 6rem;
    	padding-left: 60px;
    	padding-right: 6rem;
    	padding-right: 60px;
    }
    
    .home .archive-pagination {
    	padding-left: 6rem;
    	padding-left: 60px;
    	padding-right: 6rem;
    	padding-right: 60px;
    }
    
    .home-featured img {
    	vertical-align: top;
    }

    Then in the ‘Home Featured’ widget area, drag a text widget and write the HTML to display a image like this:

    <img src="http://placehold.it/760x150" />

    to get http://i.imgur.com/UMZZFpb.png


    #69363

    bigbyte
    Participant
    Post count: 4

    Perfect!!!! :-)

    Thank you so much. This made my day.

    #69371

    Sridhar Katakam
    Participant
    Post count: 923

    Small change.

    Change

    .content {
    	padding-top: 0;
    	padding-left: 0;
    	padding-right: 0;
    }

    to

    .home .content {
    	padding-top: 0;
    	padding-left: 0;
    	padding-right: 0;
    }

    #69561

    bigbyte
    Participant
    Post count: 4

    Got it. Thank you for your help. :-)

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.