Cutline Custom Header Trouble

akamrsx · Member · Sep 27, 2008 at 12:36 am
Copy link

Add topic to favorites
Hello all! I recently purchased the CSS upgrade to be able to make my header a bit bigger – not width, just height. I’m having a terrible time figuring out how to fix the height! When I cut and paste the Cutline style sheet into the CSS editor, I can’t find the correct areas to fix the height. Ideally, I would like to use an image that is 770 x at least 300.

My browser is IE, although I don’t know which version. It is the fairly recent one that opens multiple tabs in the same program. As you can tell, I’m a bit of a beginner and may take some translating as well as the usual help. Thanks!

http://akamrsx.wordpress.com/
vivianpaige · Member · Sep 27, 2008 at 12:51 am
Copy link
I wish you had used the preview function before purchasing the upgrade as there is no official support for CSS and very few people in the forums really know it well.

You don’t have to cut and paste the whole style sheet in the editor. The only thing you have to do is add the items you want to change. So start by deleting all that stuff (since it’s already there). You are going to want to choose the Add to stylesheet button. (Note the link to the stylesheet there.)

Whenever you have an element you want to change, try looking for the title of that element in the stylesheet. In your case, I see that the header is in the #header_img element.

I don’t see the height and width specified in the CSS specifically, but you should be able to add it in. So try this:
```
#header_img {
height: 300px
}
```
thesacredpath · Member · Sep 27, 2008 at 12:54 am
Copy link
Header size seems to be declared in #masthead
```
#masthead a {
display: block;
width: 770px;
height: 100px;
}
```
akamrsx · Member · Sep 27, 2008 at 1:00 am
Copy link
I appreciate your help – I was able to change it and so now the picture in the header is much longer, but when I go to upload, the crop tool still limits me to the 140px. Can I change this?

Thanks!
akamrsx · Member · Sep 27, 2008 at 1:02 am
Copy link
Hi thesacredpath – thanks! I fiddled with the masthead size and it added a large white area between my title and the page headings.
thesacredpath · Member · Sep 27, 2008 at 1:21 am
Copy link
Right now I’m seeing a 770px x 300px header image and no large white space between the title and the page headings.

Once you have the CSS upgrade, you have to manually add your header image URL to your CSS rather than using the custom header image upload in the dashboard. If you use the custom header image upload under design, it will always want you to cut things down to the original size, and in some instances it won’t work at all.

The URL for the header images is added like below:
```
#masthead a {
background: url('full url of header image here') no-repeat;
display: block;
width: 770px;
height: 100px;
}
```
You will have to upload the correct sized image to your media library and then get the URL after it is uploaded.

Right now I’m seeing a 770px x 300px header image.
vivianpaige · Member · Sep 27, 2008 at 1:22 am
Copy link
You can’t use the uploader anymore. You have to upload the photo and copy the location of the file and paste it into the appropriate location in the CSS file.
akamrsx · Member · Sep 27, 2008 at 1:37 am
Copy link
Thank you both for your help – I haven’t figured it out yet, but I will save it for another day and will refer back to your comments.

No items found.