The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Phpbb3 Need help adding rounded corners

View previous topic View next topic Go down

Solved Phpbb3 Need help adding rounded corners

Post by TheIceDragon on October 25th 2010, 6:55 pm

hi I need help with adding round corners to my forums,

atm the code im using to get rid of the arrows is

Code:
span.corners-top, span.corners-bottom, span.corners-top span, span.corners-bottom span {
   font-size: 1px;
   line-height: 1px;
   display: block;
   height: 5px;
   background-repeat: no-repeat;
   }
span.corners-top {
   background-image: none;
   background-position: 0 0;
   margin: 0 -5px;
   }
span.corners-top span {
   background-image: none;
   background-position: 100% 0;
   }
span.corners-bottom {
   background-image: none;
   background-position: 0 100%;
   margin: 0 -5px;
   clear: both;
   }
span.corners-bottom span {
   background-image: none;
   ;
   background-position: 100% 100%;
   }
.post span.corners-top, .post span.corners-bottom, .panel span.corners-top, .panel span.corners-bottom, .navbar span.corners-top, .navbar span.corners-bottom {
   margin: 0 -10px;
   }
span.corners-top {
    background-image: none;
    }
span.corners-top span {
    background-image: none;
    }
span.corners-bottom {
    background-image: none;
    }
span.corners-bottom span {
    background-image: none;
    }
#cp-main span.corners-top {
    background-image: none;
    }
#cp-main span.corners-top span {
    background-image: none;
    }
#cp-main span.corners-bottom {
    background-image: none;
    }
#cp-main span.corners-bottom span {
    background-image: none;
    }
#cp-main .panel #topicreview span.corners-top {
    background-image: none;
    }
#cp-main .panel #topicreview span.corners-top span {
    background-image: none;
    }
#cp-main .panel #topicreview span.corners-bottom {
    background-image: none;
    }
#cp-main .panel #topicreview span.corners-bottom span {
    background-image: none;
    }

the original code was:

Code:
span.corners-top, span.corners-bottom, span.corners-top span, span.corners-bottom span {
   font-size: 1px;
   line-height: 1px;
   display: block;
   height: 5px;
   background-repeat: no-repeat;
   }
span.corners-top {
   background-image: none;
   background-position: 0 0;
   margin: 0 -5px;
   }
span.corners-top span {
   background-image: none;
   background-position: 100% 0;
   }
span.corners-bottom {
   background-image: none;
   background-position: 0 100%;
   margin: 0 -5px;
   clear: both;
   }
span.corners-bottom span {
   background-image: none;
   ;
   background-position: 100% 100%;
   }
.post span.corners-top, .post span.corners-bottom, .panel span.corners-top, .panel span.corners-bottom, .navbar span.corners-top, .navbar span.corners-bottom {
   margin: 0 -10px;
   }
span.corners-top {
    background-image: url("http://illiweb.com/fa/prosilver/corners_left.gif");
    }
span.corners-top span {
    background-image: url("http://illiweb.com/fa/prosilver/corners_right.gif");
    }
span.corners-bottom {
    background-image: url("http://illiweb.com/fa/prosilver/corners_left.gif");
    }
span.corners-bottom span {
    background-image: url("http://illiweb.com/fa/prosilver/corners_right.gif");
    }

/***************************************************************/
#cp-main span.corners-top {
    background-image: url("http://illiweb.com/fa/prosilver_grey/corners_left2.gif");
    }
#cp-main span.corners-top span {
    background-image: url("http://illiweb.com/fa/prosilver_grey/corners_right2.gif");
    }
#cp-main span.corners-bottom {
    background-image: url("http://illiweb.com/fa/prosilver_grey/corners_left2.gif");
    }
#cp-main span.corners-bottom span {
    background-image: url("http://illiweb.com/fa/prosilver_grey/corners_right2.gif");
    }

/***************************************************************/
#cp-main .panel #topicreview span.corners-top {
    background-image: url("http://illiweb.com/fa/prosilver/corners_left.gif");
    }
#cp-main .panel #topicreview span.corners-top span {
    background-image: url("http://illiweb.com/fa/prosilver/corners_right.gif");
    }
#cp-main .panel #topicreview span.corners-bottom {
    background-image: url("http://illiweb.com/fa/prosilver/corners_left.gif");
    }
#cp-main .panel #topicreview span.corners-bottom span {
    background-image: url("http://illiweb.com/fa/prosilver/corners_right.gif");
    }

but i changed it removing the urls to none to get rid of the the white arrows in the corner, is there like a way to make corners more rounded? without showing the arrows, making it transparent, like perhaps changing the opacity or something, and making it more rounded ;s

forum is
The Elemental Flow


Last edited by TheIceDragon on October 26th 2010, 9:51 pm; edited 4 times in total

TheIceDragon
Forumember

Female Posts : 40
Reputation : 0
Language : English

http://theelementalflow.forumotion.com

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by TheIceDragon on October 26th 2010, 7:08 pm

bump.

TheIceDragon
Forumember

Female Posts : 40
Reputation : 0
Language : English

http://theelementalflow.forumotion.com

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by paor on October 26th 2010, 9:57 pm

I did this by setting the bottom code in several places in the css

Code:
border-radius: 12px;
-moz-border-radius: 12px 12px 12px 12px;
-webkit-border-radius: 12px 12px 12px 12px;
border : 1px solid #DBDBCE;

LINK REMOVED


Last edited by Gangstar15 on October 26th 2010, 10:00 pm; edited 1 time in total (Reason for editing : Link Removed - Gangstar15)

paor
Forumember

Posts : 194
Reputation : -2
Language : Croatian

http://poljoprivredni-forum.biz

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by TheIceDragon on October 26th 2010, 10:40 pm

didn't work for me, also it needs to begin with a { and ends with a } =\ ;s the version im using is phpbb3

TheIceDragon
Forumember

Female Posts : 40
Reputation : 0
Language : English

http://theelementalflow.forumotion.com

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by Maki1 on October 26th 2010, 11:15 pm

Code:
#wrap {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}

Maki1
Hyperactive

Male Posts : 2529
Reputation : 442
Language : English CSS Stylesheet
Location : The Support forum Section! No support by PM If you need custom theme please contact me!

http://forumdesigners.forumotion.com/

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by TheIceDragon on October 27th 2010, 12:32 am

tried the code but it still didn't work for me

TheIceDragon
Forumember

Female Posts : 40
Reputation : 0
Language : English

http://theelementalflow.forumotion.com

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by Maki1 on October 27th 2010, 12:29 pm

@TheIceDragon wrote:tried the code but it still didn't work for me

Try this

Code:
#wrap {
width : 850px;
padding : 5px;
border : 1px solid #666;
-moz-border-radius : 5px;
-webkit-border-radius : 5px;
}

Maki1
Hyperactive

Male Posts : 2529
Reputation : 442
Language : English CSS Stylesheet
Location : The Support forum Section! No support by PM If you need custom theme please contact me!

http://forumdesigners.forumotion.com/

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by TheIceDragon on October 27th 2010, 5:40 pm

tried that as well, but it didn't work for the corners, it just made the body width shorter and added the body borders, but not for the corners

TheIceDragon
Forumember

Female Posts : 40
Reputation : 0
Language : English

http://theelementalflow.forumotion.com

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by Guest on October 27th 2010, 5:56 pm

Code:

#wrap {
width : 850px;
padding : 5px;
border : 1px solid #666;
border-radius: 5px;
-moz-border-radius : 5px;
-webkit-border-radius : 5px;
}

Guest
Guest


Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by ankillien on October 27th 2010, 6:13 pm

Hello,

I think this code would do the trick to some extent...

Code:
.forabg {
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

Add it to Admin CP > Display > Colors > CSS

ankillien
Energetic

Posts : 5198
Reputation : 129
Language : English, XHTML, CSS, JS, PHP, SQL

http://www.webartzforum.com/

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by Guest on October 27th 2010, 6:14 pm

I though she wants it for the forum line o.O Very Happy

Guest
Guest


Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by ankillien on October 27th 2010, 6:15 pm

I'm not sure what exactly she needs. Lets wait for her reply Smile

ankillien
Energetic

Posts : 5198
Reputation : 129
Language : English, XHTML, CSS, JS, PHP, SQL

http://www.webartzforum.com/

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by Maki1 on October 27th 2010, 9:19 pm

Here you go
Code:

.forabg {
   border: 1px solid #343434;
   padding: 0px 5px;
-moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
   }

Maki1
Hyperactive

Male Posts : 2529
Reputation : 442
Language : English CSS Stylesheet
Location : The Support forum Section! No support by PM If you need custom theme please contact me!

http://forumdesigners.forumotion.com/

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by Guest on October 27th 2010, 9:36 pm

Maki1.. Anki already gave the code...

Guest
Guest


Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by paor on October 27th 2010, 9:43 pm

anybody have hack for ie7< for this code?

paor
Forumember

Posts : 194
Reputation : -2
Language : Croatian

http://poljoprivredni-forum.biz

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by Maki1 on October 27th 2010, 9:49 pm

@Gangstar15 wrote:Maki1.. Anki already gave the code...

Ok, but she still have post a screen shot.

Maki1
Hyperactive

Male Posts : 2529
Reputation : 442
Language : English CSS Stylesheet
Location : The Support forum Section! No support by PM If you need custom theme please contact me!

http://forumdesigners.forumotion.com/

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by TheIceDragon on October 27th 2010, 10:22 pm

tried the code, and seems to work now, thx anki and every1 else for helping. but now i need to add rounded corners for the postbody and profile also, since only the forum tables has the rounded corners. so would be nice if I could change it from solved to not yet solved ;s. I would like to add the rounded corners for the profile page as well.




TheIceDragon
Forumember

Female Posts : 40
Reputation : 0
Language : English

http://theelementalflow.forumotion.com

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by Maki1 on October 27th 2010, 10:40 pm

For the postbody add this.

Code:
.introduction, .panel, .post {
border: 1px solid ;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-color: #666;
}

Maki1
Hyperactive

Male Posts : 2529
Reputation : 442
Language : English CSS Stylesheet
Location : The Support forum Section! No support by PM If you need custom theme please contact me!

http://forumdesigners.forumotion.com/

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by TheIceDragon on October 27th 2010, 11:36 pm

thx problem solved, works now ^^ you may close.

TheIceDragon
Forumember

Female Posts : 40
Reputation : 0
Language : English

http://theelementalflow.forumotion.com

Back to top Go down

Solved Re: Phpbb3 Need help adding rounded corners

Post by Sanket on October 28th 2010, 7:03 am

Since this thread is marked solved, I will lock this thread.


Sanket Smile


Sanket
ForumGuru

Male Posts : 48766
Reputation : 2819
Language : English
Location : Mumbai

http://webartzforum.com

Back to top Go down

View previous topic View next topic Back to top


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