HELP! Postbit CSS - Thank You for reading..

[kevinkun]

Hello ! Thanks for reading.

So, I was looking at some vbulletin forums when I came across this one anime forum called Nihonomaru, I'm actually a big fan of it & love it's designs.

Anyways, I was looking at it's postbit template.. and I would love to know the CSS for it..
in the example below, i'm talking about the sections differentiating from one detail to the other,
Can anyone kindly do it for me?





Actually, I also noticed that the owner also sometimes appear on this forums, just a shoutout that I love your forums.

Thank You!!

[Lynne]

There are actually template mods (and perhaps an article?) on how to separate the fields into divs/blocks. Then just use CSS to decorate the boxes how you want them.

[kevinkun]

Thanks for the advice!
But unfortunately I can't find any sort of template mod that shows me how to serparate the fields from divs/blocks. Mainly because i'm not too experienced with CSS. :S

[DataHero]

What do you mean seperate fields? You mean keeping space between the borders and text? Either way, it might help if you add some margins and paddings; margins will define the space between one element and the other, while padding defines the space inside the element itself.

[Lynne]

If you look at your postbit_legacy template, you'll see all the userinfo are in pairs of <dt><dd> tags. So, put a div around them with a class, ie:

<div class="fieldbox"><dt>{vb:rawphrase 'posts'}</dt> <dd>{vb:raw post.posts}</dd></div>

Then add to additional.css something like:

.fieldbox {border: 1px solid red; border-left: 2px solid blue; margin: 5px 0px; padding: 2px 5px;}

But, modify how you want it.

[kevinkun]

Thank You very much for your assistance.