Border image around forum body
4 posters
Page 1 of 1
Border image around forum body
Hello everyone, I've got another slight problem. Is it possible to add a repeatable border image around the body of the forum? Like the example below (done in photoshop)
Forum link : http://riftclanhere.forumotion.net/t1-in-need-of-suggestions
Forum link : http://riftclanhere.forumotion.net/t1-in-need-of-suggestions
Centesimus- Forumember
- Posts : 25
Reputation : 0
Language : Dutch,English
Re: Border image around forum body
Here you go, add this to your CSS stylesheet:
Change the style, color and width to your preferences.
Change the style, color and width to your preferences.
- Code:
.pun {
border-style: solid;
border-color: #8E6D4E!important;
border-width: 10px;
}
Re: Border image around forum body
Thanks for the code- but I'd love to have an image as the border, not a solid line. Is there any way to do this?runawayhorses wrote:Here you go, add this to your CSS stylesheet:
Change the style, color and width to your preferences.
- Code:
.pun {
border-style: solid;
border-color: #8E6D4E!important;
border-width: 10px;
}
Centesimus- Forumember
- Posts : 25
Reputation : 0
Language : Dutch,English
Re: Border image around forum body
Yes but Internet Explorer does not support the border-image property. It would consist I think of adding a div to your css selector then adding the webkit coding for firefox and another one for chrome.. etc.
Its tricky and I don't have the time to figure it out right now for what you want to do. Perhaps someone else can.
Its tricky and I don't have the time to figure it out right now for what you want to do. Perhaps someone else can.
Re: Border image around forum body
Alright, thanks for the help anywaysrunawayhorses wrote:Yes but Internet Explorer does not support the border-image property. It would consist I think of adding a div to your css selector then adding the webkit coding for firefox and another one for chrome.. etc.
Its tricky and I don't have the time to figure it out right now for what you want to do. Perhaps someone else can.
Centesimus- Forumember
- Posts : 25
Reputation : 0
Language : Dutch,English
Centesimus- Forumember
- Posts : 25
Reputation : 0
Language : Dutch,English
Re: Border image around forum body
Yesterday at 12:45 pm
Today at 9:58 am
Please don't double/triple post. Your post need to be separated by 24 hours before bumping, replying or adding more information. Please use the edit button instead!
Today at 9:58 am
Please don't double/triple post. Your post need to be separated by 24 hours before bumping, replying or adding more information. Please use the edit button instead!
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: Border image around forum body
You can try replacing that code above with this one below, just add your image url where it says to in the code:
You'll probably need to adjust the sizes (i.e. 14px 24px 14px 18px) but this should give you something to work with:
You'll probably need to adjust the sizes (i.e. 14px 24px 14px 18px) but this should give you something to work with:
- Code:
.pun {
border-style: solid;
border-width: 14px 24px 14px 18px;
-moz-border-image: url(URL OF IMAGE GOES HERE) 14 24 14 18 round;
-webkit-border-image: url(URL OF IMAGE GOES HERE) 14 24 14 18 round;
-o-border-image: url(URL OF IMAGE GOES HERE) 14 24 14 18 round;
border-image: url(URL OF IMAGE GOES HERE) 14 24 14 18 fill round;
}
Re: Border image around forum body
runawayhorses wrote:You can try replacing that code above with this one below, just add your image url where it says to in the code:
You'll probably need to adjust the sizes (i.e. 14px 24px 14px 18px) but this should give you something to work with:
- Code:
.pun {
border-style: solid;
border-width: 14px 24px 14px 18px;
-moz-border-image: url(URL OF IMAGE GOES HERE) 14 24 14 18 round;
-webkit-border-image: url(URL OF IMAGE GOES HERE) 14 24 14 18 round;
-o-border-image: url(URL OF IMAGE GOES HERE) 14 24 14 18 round;
border-image: url(URL OF IMAGE GOES HERE) 14 24 14 18 fill round;
}
Thanks so far! I managed to put the border in- the problem is tho that the border is the same on both the sides- is there any way to mirror them ? So that the one on the left is looking to the right and the one on the right is looking to the left? Is there also a way to put a border at the bottom of the body?
http://runecms.forumotion.net/t1-your-first-subject
Centesimus- Forumember
- Posts : 25
Reputation : 0
Language : Dutch,English
Re: Border image around forum body
You'll have to make an image of a frame which will be transparent (png)
Like this one
When you make your frame, upload it to a host (photobucket for an example)
Then you'll have to go to a site http://border-image.com/ where you're going to adjust it the way that you want. There's an option to drop a link of your image so that you may adjust it to suit your preference.
The site will give you the same code like runawayhorses gave you, however you're the one who'll need to adjust the numbers/properties in css at the end.
Good luck!
Like this one
When you make your frame, upload it to a host (photobucket for an example)
Then you'll have to go to a site http://border-image.com/ where you're going to adjust it the way that you want. There's an option to drop a link of your image so that you may adjust it to suit your preference.
The site will give you the same code like runawayhorses gave you, however you're the one who'll need to adjust the numbers/properties in css at the end.
Good luck!
Re: Border image around forum body
The way Raziel21 explained will get you the border on all sides. I'm not a fan of image borders because although I don't use internet explorer, it can't read the border image property, so my knowledge of using image borders are limited. But I think Raziel21 has an interesting and effective method.Centesimus wrote:Thanks so far! I managed to put the border in- the problem is tho that the border is the same on both the sides- is there any way to mirror them ? So that the one on the left is looking to the right and the one on the right is looking to the left? Is there also a way to put a border at the bottom of the body?runawayhorses wrote:You can try replacing that code above with this one below, just add your image url where it says to in the code:
You'll probably need to adjust the sizes (i.e. 14px 24px 14px 18px) but this should give you something to work with:
- Code:
.pun {
border-style: solid;
border-width: 14px 24px 14px 18px;
-moz-border-image: url(URL OF IMAGE GOES HERE) 14 24 14 18 round;
-webkit-border-image: url(URL OF IMAGE GOES HERE) 14 24 14 18 round;
-o-border-image: url(URL OF IMAGE GOES HERE) 14 24 14 18 round;
border-image: url(URL OF IMAGE GOES HERE) 14 24 14 18 fill round;
}
http://runecms.forumotion.net/t1-your-first-subject
Similar topics
» Adding Image Border Around Forum
» Username Inside Quote And Image Like Support Forum's & Border
» body border
» help message body border for invision
» How to extend the border line between post body and profile area
» Username Inside Quote And Image Like Support Forum's & Border
» body border
» help message body border for invision
» How to extend the border line between post body and profile area
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum