Give your forum rounded corners! Simple no image CSS

MaddenGods

Contributor
vBSetup Team
vBulletin Owner
vBSetup Mods

#1 01-31-2008, 02:01 AM

Join Date: Jan 2008

Posts: 625

Location: Ohio

Give your forum rounded corners! Simple no image CSS

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!

Attached Images

round.jpg (178.8 KB, 32 views)

--------------------
David / vBulletin Setup Staff
Check out our Newsletter for the latest vB and SEO news.
Are you looking for vBulletin work to be done on your forums ?
Would you like to Help Support vBulletin Setup.
Check out my Webmaster Articles at the vBulletin Setup Blog! SEO Talk

Quote |

Brandon

vBSetup Team
vBulletin Owner
vBSetup Owner

#2 02-04-2008, 03:22 PM

Join Date: Jul 2006

Posts: 9,242

Location: Topeka, KS

Re: Give your forum rounded corners! Simple no image CSS

looks sharp

thanks for sharing how

--------------------

Brandon Sheley / vBulletin Setup Staff
Check out our Newsletter for the latest vB and SEO news.
Are you looking for vBulletin work to be done on your forums ?
Would you like to Help Support vBulletin Setup.

Reply to the Welcome PM for Full Access to the Forums.. Thanks

Please do not PM me for support, that's what the forums are for.

Have you heard about Crowdgather?
Find it on Forums

Check out this cool page - Bar Code Signatures

Quote |