How can I resize banner area

  • 1
  • Question
  • Updated 7 years ago
  • Answered
On this page http://www.mundesleygolfclub.com/test... the default banner height is to big, I would like to use the current banner which is 150px instead of the 218px default. How can I now lose the excess white area beneath the smaller banner?
Thanks
Photo of David

David

  • 465 Posts
  • 94 Reply Likes

Posted 7 years ago

  • 1
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hello David,

Please try this:

#sys_banner {
height: 150px;

}

Let me know how this goes :)
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Hey littleyou... ;) ;) (winking coyly) How you doin?

He might need to change the "#sys banner div" as well because that style uses a transparent png overlay with white corners and if he doesn't it might not pull his content up because the transparent (863x218) png is still stopping the content from rising.

Additionally, his current banner is cropped from 863x218 to 863x140 but in all actuality it is still 863x218 because the sitebuilder just added the white space under his shorter banner.

Original: (Right click and then click "view image info" to see the actual size)



While the codes would pull his content up he might consider replacing the cropped banner with his original which is in his file manager already by using the following CSS.

#sys_banner {
background: url(resources/banner1.jpg) 0 0 no-repeat;
height: 150px;
width:863px;
}

To use the transparent PNG with white corners save the following transparent PNG that I edited (squeezed to 150px tall) below and then upload it to your file manager and use the following code in its place:

#sys_banner {
background: url(resources/banner1.jpg) 0 0 no-repeat;
height: 150px;
width:863px;
}

#sys_banner div{
background: url(resources/corners863x150.png) top left no-repeat;
_behavior: url(templates/CleanTheme/resources/iepngfix.htc);
height: 150px;
width:863px;
}

The shortened transparent PNG is between the "Here" and "Here" below...

1) Right click the transparent PNG below and then click view image
2) In the new window click "File" then "Save page as" it will save the PNG in its original size as the forums reduces any image uploaded automatically.

Here

Here

trust me it is there... ;)

Happy site building
Ed

If the lady bears don’t find you handsome they should at least find you handy...Don't forget to share the bear....

Honey Bear Playhomes Tips and Favs in one place... A Honey bear Playhomes Tip ;)
Photo of David

David

  • 465 Posts
  • 94 Reply Likes
Hi Sanja & Ed
Thank you both for your replies, Ed I followed your instructions and modified the code in the site css and uploaded the image, I now have the new banner on every page, the white strip has been shortened but is still showing, do you have any further thoughts as to what I can do.
PS I'm not at all familiar with the site css function so the problem may well lie there.
Thanks
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Hours later... Think that I figured it out...

This was near blind guess as to the exact height that I needed to make the banner wrap. I had to duplicate the wrap image and then delete the top half of the original and then delete the bottom half of the copy and then join the two together into one.

You would think that it would have been simple... Yeah right after 10 tries I think that I got it.

1) Right click the banner wrap below and then click view image



2) In the new window click "File" then "Save page as" it will save the PNG in its original size as the forums reduces any image uploaded automatically.
3) Upload it to your file manager
4) paste the following into your CSS overrides:

#banner-wrap {
background: url(resources/banner-bg1.png) 0 0 no-repeat;
_behavior: url(templates/CleanTheme/resources/iepngfix.htc);
padding: 8px 0 26px 16px;
}

Once you do that let me know as I need to double check something...

Man with all the thousands of hours I have in helping people here it sure would be nice to get paid for them... I can dream. ;)
Photo of David

David

  • 465 Posts
  • 94 Reply Likes
Thanks Ed, I've done that and its looking good
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Wowser did I ever guess that nearly right on the money with the banner wrap edit. The ever so slight white border seems equal on all sides and that makes me happy.

Good choice on the double black line borders on the banner image.

Have fun finishing the site... Glad to help...
Photo of David

David

  • 465 Posts
  • 94 Reply Likes
Thanks again Ed, I've followed your crab pot business on the forum, hows it going?
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Gonna let it float for the year in the off season for crabbing and work on SEO in my spare time. I didn't expect it to be quick. Quite the contrary... I knew that the search engines wouldn't lift me to the first page in results right away. It takes time.

Three or so months from the start of next years season I will actively pursue distributors. Until then I am just letting the site stew.

Thanks for asking.