• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 273
  • Last Modified:

How do I make this blue bar go to the edge of my content area on either side?

I have a site here:

www.particletechlabs.com

I need to make the light blue bar that says "For more information, contact us at.." under the large image go to the edge on either side.

But I cannot figure out how to make this happen.

I've attached a screenshot of what I need.




Any help is appreciated.
screenshot.jpg
0
Donnie Walker
Asked:
Donnie Walker
  • 2
1 Solution
 
jtwcsCommented:
You can do this by applying some negative left and right margin to the rt-phonebanner div.

#rt-phonebanner {
    margin: 0 -7px;
}

Open in new window

0
 
duttcomCommented:
It looks like the blue bar doesn't go to the edge because of the padding on the containing div #rt-body-bg4.

Line 113 of template.css shows

#rt-body-bg4 {
    margin-right: -9px;
    padding: 15px 16px 0;
}

You could try

#rt-body-bg4 {
    margin-right: -9px;
    padding: 15px 0 0;
}

instead to remove the right and left padding.

I've noticed you have posted a few CSS questions in the last day or two. You might want to consider using Firebug in Firefox to debug your CSS.
0
 
Donnie WalkerAuthor Commented:
That worked out great! Thanks so much for that and the Firebug suggestion.
0
 
duttcomCommented:
Firebug is excellent for working this sort of stuff out. Sure beats playing 'find that style'!

Good luck with your project.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: C++ 11 Fundamentals

This course will introduce you to C++ 11 and teach you about syntax fundamentals.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now