Simple CSS rounded corners for your forum [no images]

Simple CSS rounded corners for your forum [no images]

Mod Version: 1.00, by SEOvB

This modification is in the archives.

vB Version: 3.7.0 Beta 4	Rating: (1 vote - 5.00 average)	Installs: 26
Released: 31 Jan 2008	Last Update: Never	Downloads: 8
Not Supported Template Edits Re-usable Code

With this simple CSS you can give your forum that look you always wanted. Sick and tired of the old bland square design every where in vBulletin? Well fear no more, because here's your rounded edges.

In your style of choice, go to add the following into the Additional CSS:

Code:

.rc{display:block}
.rc *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#000000}
.rc1{
  margin-left:3px;
  margin-right:3px;
  padding-left:1px;
  padding-right:1px;
  border-left:1px solid #919191;
  border-right:1px solid #919191;
  background:#3f3f3f}
.rc2{
  margin-left:1px;
  margin-right:1px;
  padding-right:1px;
  padding-left:1px;
  border-left:1px solid #e5e5e5;
  border-right:1px solid #e5e5e5;
  background:#303030}
.rc3{
  margin-left:1px;
  margin-right:1px;
  border-left:1px solid #303030;
  border-right:1px solid #303030;}
.rc4{
  border-left:1px solid #919191;
  border-right:1px solid #919191}
.rc5{
  border-left:1px solid #3f3f3f;
  border-right:1px solid #3f3f3f}
.rcfg{
  background:#000000}

Then in your header, at the very top enter:

Code:

<div>
  <b class="rc">
  <b class="rc1"><b></b></b>
  <b class="rc2"><b></b></b>
  <b class="rc3"></b>
  <b class="rc4"></b>
  <b class="rc5"></b></b>
  <div class="rcfg">

Then in footer at the very bottom put:

Code:

  </div>
  <b class="rc">
  <b class="rc5"></b>
  <b class="rc4"></b>
  <b class="rc3"></b>
  <b class="rc2"><b></b></b>
  <b class="rc1"><b></b></b></b>
</div>

That will make a black box, with white background, just change the colors in the CSS to match your forum, and you're set!

Download

No files for download.

Screenshots

vBulletin LTS