Welcome to WebmasterWorld Guest from 54.145.136.73

Forum Moderators: not2easy

Border around forum posts

   
8:38 pm on Jul 1, 2012 (gmt 0)

5+ Year Member



Hello guys!

I'm currently setting up my forum and I want to change some defaults.
I have SMF 2.0.2
The problem is that by default it doesn't have a post separator. But there's a mod to change that. Basically it modifies 2 files: Display.template.php and index.css
My question is about the latter one. It adds this at the end of the file:

.seperate {
/*border: 5px solid #fff; thickness and color of box outline*/
margin: 7px auto; /*to push the gap between the posts*/
}


I do get the white spacing between the posts, BUT what I had in mind was something that goes a little beyond that.

I can't attach a file that shows how I would like it to look like more or less. I think it's disabled here. Maybe I can post a link to it?

The color of the border could be solid one, that's not so critical to me.
When I tried to uncomment the 2nd line, what happened is that I got a border around the post and everywhere (ie. top, bottom, right and left) was the same. Same thickness that is...
Anyway, if anybody knows what to do please let me know!
9:50 pm on Jul 1, 2012 (gmt 0)

WebmasterWorld Senior Member lucy24 is a WebmasterWorld Top Contributor of All Time Top Contributors Of The Month



Borders don't have to be the same on all sides. You can set entirely different values-- style, size, color-- for

border-left
border-top

and so on. The same goes for margins. And for padding.
2:55 am on Jul 2, 2012 (gmt 0)

5+ Year Member



It's getting better! I wrote this code and I've got everything right, EXCEPT on the left side.

.seperate {
border-top: 25px solid #3a5284; thickness and color of box outline*/
border-left: 1px solid #3a5284;
border-right: 1px solid #3a5284;
border-bottom: 1px solid #3a5284;

margin: 7px auto; /*to push the gap between the posts*/
}

On the left, there's nothing, just empty space...Why is that?
3:23 am on Jul 2, 2012 (gmt 0)

5+ Year Member



It's OK now...just have to add a commenting sign. Didn't pay attention to that before...

.seperate {
border-top: 25px solid #3a5284; /*thickness and color of box outline*/
border-left: 1px solid #3a5284;
border-right: 1px solid #3a5284;
border-bottom: 1px solid #3a5284;

margin: 7px auto; /*to push the gap between the posts*/
}

It works like swiss clock now

[edited by: alt131 at 12:23 pm (utc) on Jul 7, 2012]
[edit reason] Thread Tidy - 404 [/edit]

3:58 pm on Jul 2, 2012 (gmt 0)

WebmasterWorld Senior Member rocknbil is a WebmasterWorld Top Contributor of All Time 10+ Year Member



shorter version,

.seperate {
border: 1px solid #3a5284;
border-top: 25px solid #3a5284;
}

The last rule overwrites the first and adjusts the top.
4:59 pm on Jul 2, 2012 (gmt 0)

WebmasterWorld Senior Member lucy24 is a WebmasterWorld Top Contributor of All Time Top Contributors Of The Month



{border-top-width: 25px;}

if nothing else is changing.
 

Featured Threads

My Threads

Hot Threads This Week

Hot Threads This Month