Custom CSS for header image

GetShotbyMel · September 15, 2014

My site is www.getshotbymel.com

I'd like the main header image on the front page to be shorter. I can't figure out what custom CSS to use to allow that. I think it takes up too much of the page. My goal is for it to be 1441x350. The 1441 is the pre-set width. It's the height I want to change.

Any help would be appreciated!

denisegoldberg · September 15, 2014

GetShotbyMel wrote: »

I'd like the main header image on the front page to be shorter. I can't figure out what custom CSS to use to allow that. I think it takes up too much of the page. My goal is for it to be 1441x350. The 1441 is the pre-set width. It's the height I want to change.

You could try using a smaller version of the image, but that will change both the width and height. For example, if you use the L instead of the XL the image size is 800x282 instead of 1024x360, the size of the image you are currently using.

If you only want to change the height then you need a different image - one that fits the aspect ratio you are trying to use.

--- Denise

GetShotbyMel · September 15, 2014

Hmmm....
Denise - I just want to change the height, and I tried to use an image of a smaller height, but it just stretched out wide to use the same height. I tried asking the help gurus, but they wanted me to post here....

denisegoldberg wrote: »

You could try using a smaller version of the image, but that will change both the width and height. For example, if you use the L instead of the XL the image size is 800x282 instead of 1024x360, the size of the image you are currently using.

If you only want to change the height then you need a different image - one that fits the aspect ratio you are trying to use.

--- Denise

denisegoldberg · September 15, 2014

GetShotbyMel wrote: »

Denise - I just want to change the height, and I tried to use an image of a smaller height, but it just stretched out wide to use the same height. I tried asking the help gurus, but they wanted me to post here....

Maybe someone else can provide a CSS trick to cut down the height of the image...

The photo you are using is currently showing as 1024x360. That's about the height you said you want to use - but I would agree with your statement that it is too large. I'm having a hard time understanding how changing the height but leaving the width alone would give you a reasonable looking image. I still believe you need to reference a photo that is already in the aspect ratio that you want to use. If you want an image that is wide but not very tall then create an image that matches that aspect ratio.

--- Denise

GetShotbyMel · September 16, 2014

New image
I want to upload a completely different photo. But when I do, it stretches, instead of shrinking the height...

denisegoldberg wrote: »

Maybe someone else can provide a CSS trick to cut down the height of the image...

The photo you are using is currently showing as 1024x360. That's about the height you said you want to use - but I would agree with your statement that it is too large. I'm having a hard time understanding how changing the height but leaving the width alone would give you a reasonable looking image. I still believe you need to reference a photo that is already in the aspect ratio that you want to use. If you want an image that is wide but not very tall then create an image that matches that aspect ratio.

--- Denise

denisegoldberg · September 16, 2014

GetShotbyMel wrote: »

I want to upload a completely different photo. But when I do, it stretches, instead of shrinking the height...

Can you post a link to the photo you are trying to use? Also indicate exactly how you intend to use it. If as a logo, what size are you trying to use (as in pixels width x height).

--- Denise

GetShotbyMel · September 21, 2014

Image to use
This is the image I want to use.

http://decor8rgirl.com/wp-content/uploads/2014/09/Banner11.jpg

Thank you!

Custom CSS for header image

Comments