• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Border radius don't show

Allan

Well-known member
#1
I work on a new style, but i have one problem, the border radius don't show, an idea ?

My code:
Code:
.border_cat {
border: 1px solid #cccccc !important;
border-radius: 10px !important;
box-shadow: rgba(0,0,0,0.08) 0px 1px 3px;
}
border.png
 

Allan

Well-known member
#3
No, it's on local test :(

I have my css here: node_category_level_1 (red text)
<xen:if is="{$renderedChildren}">
<ol class="nodeList border_cat">
<xen:foreach loop="$renderedChildren" value="$child">{xen:raw $child}</xen:foreach>
</ol>
</xen:if>
 

Jake Bunce

XenForo moderator
Staff member
#5
Add some padding:

Code:
.border_cat {
border: 1px solid #cccccc !important;
border-radius: 10px !important;
box-shadow: rgba(0,0,0,0.08) 0px 1px 3px;
padding: 10px;
}
That will fix it.
 

Kier

XenForo Developer
Staff member
#6
The problem is that the box inside the one with border radius does not have a border radius of its own, so it's busting out of the radiused container. Add a border radius to the internal box with the background image / colour of one pixel less than the outer box, and it will work fine.
 

Allan

Well-known member
#8
The problem is that the box inside the one with border radius does not have a border radius of its own, so it's busting out of the radiused container. Add a border radius to the internal box with the background image / colour of one pixel less than the outer box, and it will work fine.
Yes, that's what I thought also when Jake spoke to me to the padding.