The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Border image around forum body

4 posters

Go down

Border image around forum body Empty Border image around forum body

Post by Centesimus August 19th 2013, 10:48 am

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)

Border image around forum body Eitbb8


Forum link : http://riftclanhere.forumotion.net/t1-in-need-of-suggestions
Centesimus
Centesimus
Forumember

Posts : 25
Reputation : 0
Language : Dutch,English

Back to top Go down

Border image around forum body Empty Re: Border image around forum body

Post by runawayhorses August 19th 2013, 2:38 pm

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;
}
avatar
runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 166
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Border image around forum body Empty Re: Border image around forum body

Post by Centesimus August 19th 2013, 5:23 pm

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;
}
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?
Centesimus
Centesimus
Forumember

Posts : 25
Reputation : 0
Language : Dutch,English

Back to top Go down

Border image around forum body Empty Re: Border image around forum body

Post by runawayhorses August 19th 2013, 6:06 pm

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.
avatar
runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 166
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Border image around forum body Empty Re: Border image around forum body

Post by Centesimus August 19th 2013, 7:45 pm

runawayhorses 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.
Alright, thanks for the help anyways Smile
Centesimus
Centesimus
Forumember

Posts : 25
Reputation : 0
Language : Dutch,English

Back to top Go down

Border image around forum body Empty Re: Border image around forum body

Post by Centesimus August 20th 2013, 4:58 pm

bump
Centesimus
Centesimus
Forumember

Posts : 25
Reputation : 0
Language : Dutch,English

Back to top Go down

Border image around forum body Empty Re: Border image around forum body

Post by SLGray August 20th 2013, 8:31 pm

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!


Border image around forum body Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51463
Reputation : 3519
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

Border image around forum body Empty Re: Border image around forum body

Post by runawayhorses August 21st 2013, 4:17 am

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;
}
avatar
runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 166
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Border image around forum body Empty Re: Border image around forum body

Post by Centesimus August 21st 2013, 10:32 am

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
Centesimus
Forumember

Posts : 25
Reputation : 0
Language : Dutch,English

Back to top Go down

Border image around forum body Empty Re: Border image around forum body

Post by Raziel21 August 21st 2013, 12:09 pm

You'll have to make an image of a frame which will be transparent (png)

Like this one Border image around forum body Frame

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!
Raziel21
Raziel21
Forumember

Male Posts : 86
Reputation : 0
Language : Serbian, English, Russian, Italiano, Espanol
Location : Belgrade, Serbia

http://mizuchi.forumotion.com/forum

Back to top Go down

Border image around forum body Empty Re: Border image around forum body

Post by runawayhorses August 23rd 2013, 2:02 pm

Centesimus wrote:
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
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.
avatar
runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 166
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum