Jump to content
Sign in to follow this  
ruthtoledoaltschuler

Branding image with no padding - More questions

Recommended Posts

ruthtoledoaltschuler

Hello, I have started a discussion on this and the solution is still in the works. Here is the first part of the discussion: http://www.pagelines.com/forum/discussion/11778/branding-image-with-no-padding#Item_5 Now where I am is I have been able to place the image correctly, once ot was made with 980 pixels. However, I cannot use the Global Options feature to upload my header image any more, so the site Title and Description show overlayed on the image I have behind it. It would be best if I could continue to use this uploading feature, but I can do this that was suggested by Danny if there is no other way. #branding { background: url("URL to your new header image") no-repeat scroll 0 0 #3BBEAE !important; height: 182px; margin: 0 auto; width: 980px; } And in this case I need to program Title and Site description as transparent. I have been trying to fix it with Firebug, but the coding for that part follows general coding for other titles of the site. Can someone help me with this? Thank you in advance!!

Share this post


Link to post
Share on other sites
ruthtoledoaltschuler

The new Forum format seems to be better than before, but once you thank someone it is as if all was answered and in my case it was not... Is there a way we can edit the Answered Green Button?

Share this post


Link to post
Share on other sites
cmunns

You would just have to be more specific about the selector e.g. not just H1 {}, but #branding H1 {} also, try using the text-indent:-99999; instead of transparency.

Share this post


Link to post
Share on other sites
ruthtoledoaltschuler

Thank you, It is great to count on all your help! Is there a way to fully eliminate the padding around the header image, having an image with the full size of 980 pixels perfectly centered and aligned, uploaded in the normal way in the Pagelines Global options? By just changing the padding code? I am able to do this on all sides except for the left, so I wonder if there is a way to eliminate the misalignment and have it in the right place: http://www.ngkglobalcoaching.com.br/wp-content/uploads/2011/07/Screen-shot-2011-07-26-at-7.58.04-AM.png And again, thank you SO MUCH for all help offered.

Share this post


Link to post
Share on other sites
catrina

You can try adjusting the left margin so that the image aligns left. For example:

div.branding_wrap {margin-left: -5px;}

The margin value can be adjusted until the image is positioned correctly.


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
ruthtoledoaltschuler

Brilliant, Catrina, thank you so much!! So now I made my image with the exact size of 980 pixel and in my custom code I have: #branding .content-pad { padding: 0px 0px 0px 0px; } div.branding_wrap {margin-left: -10px;} Please do let me know if any of that is unnecessary or should be done in a different way. Thank you so much for being so resourceful, helpful and precise!

Share this post


Link to post
Share on other sites
emasdesign
Just a follow up on this one, here is what I did according to Ruth's solution: Insert: #branding .content-pad { padding: 0px 0px 0px 0px; } div.branding_wrap {margin-left: -10px;} But my image was not centered at all, so I also inserted: div.branding_wrap {margin-top: -10px;} div.branding_wrap {margin-bottom: -10px;} Oh, and even though the global width of my page is set to 960 i still had to make my image 980. Something with margins or something like that.. Play around with the px values to adjust and make it look good, thanks Ruth!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×