Horizontal borders

[noman]

Horizontal borders preview


In the code the horizontal border colour is set to #000000; (black), and the Main background colour is set to white (#ffffff;). You can swap these hex codes for your own colours.


You can also change the pixel (px) width of the borders. In the code they are currently set to 10px and 1px.

Also you can change the border style. In the code, just swap solid, for either dashed or dotted.



<style type="text/css">

<!--

/* Border Colour */


table table table {border-top: 10px solid #000000;}
td td td {border-bottom: 1px solid #000000;}


/* Main Background Colour */


table table table table{border-color: #ffffff;}
td td td td {border-color: #ffffff;}

-->

</style>




Just one more thing

In the Admin Panel go to...

Customize Your Forum > Skins / Forum Colors > Create Skin or Modify Skin


...and change the border colour to match the main background colour

[Michael]

Pretty cool, Matt! This code works anywhere though, wouldn't it? I mean, anywhere that reads CSS right?

[noman]

As it is, it would only work as it should on a ProBoards forum, due to the way the tables and table cells are placed (nested) inside one another.

[Michael]

Oh, okay. Well, it's still cool none the less. How'd you come about figuring this out?

[noman]

First i need to find out where all the tables and table cells were, using this css:

table, td {border: 1px solid #000000;}

which looked like this:



and then I needed to work out which table and table cell borders I needed to change.

For example if I wanted to change a table cell inside another table cell I would write td twice (as my selector), and what ever property and value I assigned to this selector would only effect the second td, and so on.

td td {property:value;}

So where I've repeated table three times, that would only effect a table nested within a table within another table. Hope that makes sense.

The short answer is it took a lot of messing around ;D

[Michael]

No, it makes perfect sense! I understood completely. Very clever, Matt. A+ for cleverness. ;]