Change header size

  • Author
    Posts
  • #21170

    lindacharneslmft
    Member
    Original poster

    I tried to change the header size in the custom css with this code from another post I saw in here.
    #header {
    height: 174px;
    }

    when I uploaded the image of that size it automatically croped it and decreased to the theme size of 960×140 and left open space to teh 174 mark.

    How can I change the header size. I actually want it flush to the left and right so it takes up the entire length of the theme, and 200 height

    Thanks!

    The blog I need help with is: lindacharneslmft.wordpress.com

    #21430

    lindacharneslmft
    Member
    Original poster

    can someone answer me please?

    #21453

    Hi,

    You’ll want to upload the image and user background: url(); instead of the image uploader for your header instead.

    Do you have the custom CSS upgrade for WordPress.com?

    Please upload the image you’d like to use, show me the link/url and I can help you with some CSS to get you pointed in the right direction.

    Kind Regards,
    Scott

    #21481

    lindacharneslmft
    Member
    Original poster

    The picture I have in the header is 960×300 but when I uploaded it it was cropped. How can I change the header height to 300?

    Thanks and yes I have the upgrade

    #21488

    Hi,

    You can use the following CSS:

    #header {
    background: url(http://lindacharneslmft.files.wordpress.com/2012/12/cropped-nyc-skyline-4_967x3221.jpg) no-repeat scroll center center!important;
    height: 140px;
    padding: 0;
    }

    Hope this helps!

    Kind Regards,
    Scott

    #21495

    lindacharneslmft
    Member
    Original poster

    I used this and it worked in making the bottom of the pic bigger but the top of the picture is still being cropped…can you help?
    Thanks!

    #21538

    Hey again,

    Is this the full sized image:

    http://lindacharneslmft.files.wordpress.com/2012/12/cropped-nyc-skyline-4_967x3221.jpg

    Here’s what I see:

    http://cld.wthms.co/JlgS

    Kind Regards,
    Scott

    #21551

    midtownmft
    Member

    I see the same thing you see and the top half of the pic is cut off. The height of the picture that pulls when you view the home page isn’t 321px. What should I do? Increase the pic more to like 500px knowing that the top 200 px will get cut off? This header size depends if I’m keeping the theme so its important to me. I want a good sizeable header pic but I iove the rest of the theme. Thanks!

    #21552

    Hey again,

    The image you’ve uploaded is 140px.

    http://lindacharneslmft.files.wordpress.com/2012/12/cropped-nyc-skyline-4_967x3221.jpg

    Could you please upload the full size image (321px in height) and send me the link here.

    I’ll be able to provide the correct CSS to get this looking the way you’d like then.

    Let me know, thanks!

    Kind Regards,
    Scott

    #21553

    lindacharneslmft
    Member
    Original poster

    I figured it out…I changed px from 140 in the code you gave me to 280 and it worked :) Now…is there a way I can soften the edges of the picture? Like out a shadow or shadow border around the pic?

    #21554

    Hey again,

    Try something like:

    #header {
    width: 960px;
    margin: 0 auto;
    -webkit-box-shadow: 1px 0px 20px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    1px 0px 20px rgba(50, 50, 50, 0.75);
    box-shadow:         1px 0px 20px rgba(50, 50, 50, 0.75);
    }

    Kind Regards,
    Scott

    #21565

    lindacharneslmft
    Member
    Original poster

    Thanks!

    #21567

    lindacharneslmft
    Member
    Original poster

    I love the way that looks on the header…how can I add that to pictures I add to pages?

    #21569

    Hi again,

    Please try this for images in posts/pages:

    .entry img {
     -webkit-box-shadow: 1px 0px 20px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    1px 0px 20px rgba(50, 50, 50, 0.75);
    box-shadow:         1px 0px 20px rgba(50, 50, 50, 0.75);
    }

    Kind Regards,
    Scott

The topic ‘Change header size’ is closed to new replies.