Jump to content


Photo

Highlight Banner Spacing


This topic has been archived. This means that you cannot reply to this topic.
8 replies to this topic

#1 nelsons

nelsons

    Advanced Member

  • Members
  • PipPipPip
  • 40 posts

Posted 24 October 2010 - 09:46 PM

I would like to change the spacing of the highlight banner between the Nav and the banner itself. I have found the following CSS that appears to work : #highlight .highlight-splash { margin-bottom:0; margin-left:0; margin-right:0; margin-top:3em; If I change the margin-top to -2em I get the exact sizing I would like, however I can seem to get it to work in the custom CSS box. Any help ?

#2 catrina

catrina

    Advocate

  • Members
  • 12345 posts

Posted 24 October 2010 - 10:24 PM

Hello,

Since you have that code already, you can use it to replace the #highlight .highlight-splash code that is already in one of the CSS files.

Open the pro.css file (inside the pro folder) and look for this code:
 #highlight .highlight-splash{margin: 3em 0 0 0;}
. Replace it with the code you figured out and save the file.

#3 nelsons

nelsons

    Advanced Member

  • Members
  • PipPipPip
  • 40 posts

Posted 25 October 2010 - 07:32 PM

Hi Catrina I now need to change the following top padding to 0px : #highlight .content-pad .highlight-area { padding-top:40px; } However, firebug reports that this is in the pro.css file at line 422, I have looked at this file and line 422 says : #highlight { text-align: center; } #highlight .content-pad .highlight-area{padding: 40px 8px;} #highlight .copy-pad .highlight-area{padding: 20px 15px;} Can you tell me where to change the top padding for the highlight box ?? Thanks S

#4 bryan-hadaway

bryan-hadaway

    Advocate

  • Members
  • PipPipPipPipPip
  • 3697 posts

Posted 26 October 2010 - 03:57 AM

Yeah, the line #'s can be off for multiple reasons. Just do a Cmnd+F or Ctrl+F for what you're looking for in the CSS files. Thanks, Bryan

#5 nelsons

nelsons

    Advanced Member

  • Members
  • PipPipPip
  • 40 posts

Posted 26 October 2010 - 08:53 AM

Hi Bryan. It's not there in the pro.css hence my question the only code in there that pertains to .content-pad .highlight-area is shown above.. Is there somewhere else the padding-top values may be ?

#6 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 26 October 2010 - 04:41 PM

What version of Platform are you using? CSS hierarchy was slightly off with previous versions which made the custom css box not work as it should. You can fix it by being more specific ` body #highlight .highlight-splash { margin-bottom:0; margin-left:0; margin-right:0; margin-top:3em; } ` e.g. like the addition of 'body' in the code above

#7 nelsons

nelsons

    Advanced Member

  • Members
  • PipPipPip
  • 40 posts

Posted 26 October 2010 - 04:45 PM

Hi I assume I am using the latest version as I only downloaded it less than 4 days ago. So am I safe to add this code as is to the pro.css file in place of the existing code for the highlight bar ? Thanks S

#8 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 26 October 2010 - 06:04 PM

Never assume that you are safe :) Product iterations can happen rapidly. Yes you can do that, but again i would end up copying that into the Base theme so you always have it.

#9 nelsons

nelsons

    Advanced Member

  • Members
  • PipPipPip
  • 40 posts

Posted 26 October 2010 - 07:07 PM

Superb... I replaced it and changed the pixel values to em values whatever they are.. it's fixed.