Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

[Solved] How do I Add a border around my forum using CSS (see image for example)*

4riS4riS New
edited September 2011 in Vanilla 2.0 - 2.8
Hello,

I would like to add a border like the red border i draw.
How can i do that...
Here is the picture : http://imagehost.4ris.info/images/772vanilla.png

Thanks in advance..
Tagged:

Best Answers

  • zodiacdmzodiacdm
    Answer ✓
    well, this is done with some simple css.

    The easiest way to modify css is to use a browser that supports code inspection, like google chrome or firefox with the firebug extension.

    then you just right click on the object you want to change, and go to 'inspect element'.

    This will give you a list of the object's currently assigned css values, and where to find them in the css file.

    to get a red border for example, on the #Content box:
    #Content { border: 1px solid red; }
  • Answer ✓
    div#Body { border: 1px red solid ; overflow: hidden; }

    ?
  • Answer ✓
    Great. You have to add the overflow:hidden as the elements inside are floated - you could always float that container too, that would do it.

Answers

  • zodiacdmzodiacdm
    Answer ✓
    well, this is done with some simple css.

    The easiest way to modify css is to use a browser that supports code inspection, like google chrome or firefox with the firebug extension.

    then you just right click on the object you want to change, and go to 'inspect element'.

    This will give you a list of the object's currently assigned css values, and where to find them in the css file.

    to get a red border for example, on the #Content box:
    #Content { border: 1px solid red; }
  • I know how to add border on the Contect box.
    I want to add a border not only on the content but panel too (Together as i show on image).
    I tried but only the width is fine and the height is about 10px. I don;t know why.
    Any solution ?
  • Answer ✓
    div#Body { border: 1px red solid ; overflow: hidden; }

    ?
  • Answer ✓
    Great. You have to add the overflow:hidden as the elements inside are floated - you could always float that container too, that would do it.
  • Well RobChe it works.
    Thank you very much.
  • Ah, I actually didn't know about the overflow trick.

    Another solution, though probably not really better, is to give the element after the floating one a
    { clear: both; }
    which will do the same thing, though I would rather just add another property to the floating element.
Sign In or Register to comment.