How do I increase the header height?

[Utech22]

Where in the css do I go to increase the default theme header height?

[Antechinus]

That's one image (main_block.png). You can't increase that area's height just by changing the css. You have to alter the background image as well.
There's a psd available here: http://www.simplemachines.org/community/index.php?topic=347195.0

It's one of the zips attached to that post.

[Utech22]

Which folder is main_block.png in as I am not seeing it in /Themes/default/images

[adbrad]

 /Themes/default/images/theme

[Utech22]

Thanks, just saw it too 

[Utech22]

I am not sure how to modify this:
It looks tricky

[Utech22]

I just want to increase the height where the Forum Tittle is at the top to let it match the
height of a header image that I want to add.

Here is how it looks now: http://forum.fashionsjamaica.com

[Antechinus]

Damn. You get me the number of that girl in the red dress and I'll tell you how to fix your theme.

[Yahmez]

Damn. You get me the number of that girl in the red dress and I'll tell you how to fix your theme.

that was funny Antechinus.
Its a royal pain to stretch the header compared to 1.1.X

[Antechinus]

Well hey, she's seriously licious.

Ok Utech22, you need to know how to work with image layers. That file is actually a psd and Fireworks may not pick up all the layer styles properly. It doesn't seem to be showing the guides either. Would be better if you had access to Photoshop but you could do the job in Fireworks if you know how to work it.

Basically what you need to do is shift that blue layer further down, but it was made to match the background layer so you may have to play with that too to get it looking really slick. How much do you know about image editing?

[Utech22]

Its a png

[Antechinus]

Well that's why I linked you to the psd.

There's a psd available here: http://www.simplemachines.org/community/index.php?topic=347195.0

It's one of the zips attached to that post.

Specifically, it's this zip: http://www.simplemachines.org/community/index.php?action=dlattach;topic=347195.0;attach=125872

That has all the layers, styles and guides included. Working off the basic png out of the theme folder would be much more difficult.

[Yahmez]

Gimp can handle psd files...

[Utech22]

Well that's why I linked you to the psd.

There's a psd available here: http://www.simplemachines.org/community/index.php?topic=347195.0

It's one of the zips attached to that post.

Specifically, it's this zip: http://www.simplemachines.org/community/index.php?action=dlattach;topic=347195.0;attach=125872

That has all the layers, styles and guides included. Working off the basic png out of the theme folder would be much more difficult.

lol. I don't know where to start. I d/l the file. I want the header height to be 150px;

I have photoshop.

[Antechinus]

Gimp can handle psd files...

Not very well.

Ok Utech, the simplest way of doing this if you don't know much about handling psd's is to just switch off the header_blue_lower layer before going to "Save for web and devices". Save as png-8 with 108 colours and 97% dither.

Now on the other hand, if you still want the extra blue bit to show over the light blue background gradient you will have to play around a bit to get it looking how you want it. Start by moving the header_blue_lower layer down so that its top is 150 px from the top of the header section. Turn off the header_blue_upper layer. Then make a rounded rectangle of the appropriate height (corner radius 6px) in #c9d7e7 and using a black to white gradient on a layer mask to get the fade to transparent effect. Get it looking how you want then save as before.

[Utech22]

Any1 can modify the height of the header to 150px and send the file to me..

[sAce]

Any1 can modify the height of the header to 150px and send the file to me..

use this if you like http://soumik-ace.com/index.php?action=downloads;sa=view;down=12

[fiver]

Hi Utech22,


U can use mine but it's 120px. I got blue, green and red: www.fivearts.net

[Utech22]

Gimp can handle psd files...

Not very well.

Ok Utech, the simplest way of doing this if you don't know much about handling psd's is to just switch off the header_blue_lower layer before going to "Save for web and devices". Save as png-8 with 108 colours and 97% dither.

Now on the other hand, if you still want the extra blue bit to show over the light blue background gradient you will have to play around a bit to get it looking how you want it. Start by moving the header_blue_lower layer down so that its top is 150 px from the top of the header section. Turn off the header_blue_upper layer. Then make a rounded rectangle of the appropriate height (corner radius 6px) in #c9d7e7 and using a black to white gradient on a layer mask to get the fade to transparent effect. Get it looking how you want then save as before.

108 colours and not 128 ..right?

[Antechinus]

Either will work. I got acceptable image quality by using 108 and less colours gives a smaller file size. Use whatever works.

[Utech22]

Thanks @all

take a look: http://forum.fashionsjamaica.com

[Antechinus]

Cool. I still want the number of that girl in the red dress.

[Utech22]

Cool. I still want the number of that girl in the red dress.

lol

[Utech22]

Where in the css I go to get the forum docked right at the top of the page?

[Antechinus]

Not sure what you mean.

[Utech22]

got it ..... pading  .... in the body tag

[median]

I know this post is old but I need help on this same subject. I have tried editing the main_block file in CS3 but it's not working. I am saving as directed above and still nothing. All I get is a white background and the colors go away. Can you help?

median

www.innatedebate.com

[MovedGoalPosts]

main_block.png is called from your css styling using something called css image sprites.  If you look at the css for an element say

Code Select Expand

background: url("../images/theme/main_block.png") no-repeat scroll 100% -480px transparent;, the -480px gives the co-ordinate, within the image, that is being called to display.

[Shambles]

I know this post is old but I need help on this same subject...

You might have been better creating your own topic as this has been marked (with a green tick) as "solved", by Utech22, so other members may not pick up on it