WordPress.org

Forums

Vantage
Space Around Logo Header (7 posts)

  1. proffg
    Member
    Posted 1 year 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 1 year ago #

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

    header#masthead {
    	background: none;
    }
  3. proffg
    Member
    Posted 1 year 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 1 year 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 1 year 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 1 year 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 1 year ago #

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

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags

No tags yet.