WordPress.org

Ready to get started?Download WordPress

Forums

Vantage
Space Around Logo Header (7 posts)

  1. proffg
    Member
    Posted 5 months ago #

    Hi,

    This is the website i am working on:
    theicec.com

    As you can see, there is white space around the logo, how can i remove that space and stretch the logo image to cover that space?

    Thanks

  2. Tareq
    Member
    Posted 5 months ago #

    Remove the whitespace by adding the following to your custom CSS:

    header#masthead {
    	background: none;
    }
  3. proffg
    Member
    Posted 5 months ago #

    I added it, it removed the white space, but made the logo smaller in width than the body of the website, and created space between them. Can you check the same link and let me know? Thanks

  4. proffg
    Member
    Posted 5 months ago #

    I managed to remove the space between the logo and the meanu, but the logo now is smaller than the width of the box, can someone advise please? this is the code i am using now:

    header#masthead {
            background: none;
    
    }
    
    header#masthead hgroup {
    	position: relative;
    
    	padding-bottom: 0px;
    	padding-top:0px;
    	zoom: 0;
  5. Tareq
    Member
    Posted 5 months ago #

    Replace what I just told you above with this:

    header#masthead {
    	background: url('http://www.theicec.com/wp-content/uploads/2014/02/Logo-4.png') no-repeat;
    	overflow: hidden;
    	padding-top: 235px;
    	background-size: contain;
    }

    You may want to fiddle with the padding-top to align it just how you like it.

    You will also want to add this to custom CSS:

    header#masthead hgroup .logo img {
    	display: none;
    }

    Let me know how you get on!

  6. proffg
    Member
    Posted 5 months ago #

    I used what you gave me and added some minor tweeks and it worked! Here is the code:

    header#masthead {
            background: url(http://www.theicec.com/wp-content/uploads/2014/02/Logo-4.png) no-repeat;
            overflow: hidden;
            padding-top: 235px;
            background-size: contain;
    }
    
    header#masthead hgroup .logo img {
            display: none;
    }
    
    header#masthead hgroup {
    	position: relative;
    
    	padding-bottom: 0px;
    	padding-top:0px;
    	zoom: 0;
    }

    Thanks Tareq. Jazaka Allah Khair!

  7. Tareq
    Member
    Posted 5 months ago #

    Looking good my friend, anything else I can help with?

Reply

You must log in to post.

About this Theme

About this Topic

Tags

No tags yet.