Remove columns in header

  • Author
    Posts
  • #1028066

    urbanbandit
    Member

    Hi there,

    I’m using the Sight theme and would like to have an image (or text) span the entire masthead. Since the theme has place holders for a search box and menu within the header I think there must be columns embedded in the header that are preventing my image from filling the full space.

    I have already removed the search box (with code below) and am not using the menu in this area.

    If I can’t have the image span the entire space I’d at least like to be able to move the text to the far right. Is that possible? I’ve tried adjusting the padding but no luck.

    Code used for removing search box:
    /* Remove sidebar */
    header[role=”masthead”] {
    display: none;
    }

    Code being used for title and tagline (I’ve altered the size of the text and some padding from original design):
    .site-title a {
    color:#000;
    text-decoration:none;
    }

    .site-description {
    clear:none;
    color:#656363;
    float:left;
    font-size:20px;
    line-height:1.3;
    margin:0 4.47761% 0 3.17761%;
    padding:5.5em 0 0;
    width:43.283582089%;
    }

    I tried this code to remove potential columns in the header but didn’t seem to work:
    /* Remove sidebar */
    header[role=”masthead”] {
    display: none;
    }

    Many thanks and appreciate your knowledge while I’m learning!

    The blog I need help with is urbanbandit.wordpress.com.

    #1028330

    To make the header image area full width in the Sight theme, add this to your Appearance → Custom Design → CSS editor:

    .site-header hgroup,
    .header-link {
    	width: 100%;
    }

    If you’d like to add back the search box and move it to the bottom right, you could remove the rule to hide it first and then try adding something like this:

    .site-header{
    	overflow: hidden;
    }
    .header-nav-search-container {
    	position: absolute;
    	right: 0;
    	bottom: 0;
    }
    #1028343

    urbanbandit
    Member

    You are amazing! Thanks very much!

The topic ‘Remove columns in header’ is closed to new replies.