After many years of experience, I would like to know from you designers how I can solve this problem and a ridge

[Alex - Rosas † Negras]

[Bizz]

 show the css you have used for the border

[Alex - Rosas † Negras]

#xg_masthead /*Top Image*/ {
margin: auto;
display: block;
height:600px;
width: auto !important;
background: #000 url(https://storage.ning.com/topology/rest/1.0/file/get/9858802674?prof...) center repeat scroll;
border:13px ridge #eed255!important;
padding: 10px 0px 0px 0px !important;
border-left: 3px solid #000;
border-right: 3px solid #000;
border-top: 3px solid #000;
border-bottom: 3px solid #000;
-webkit-border-radius: 9px;
-moz-border-radius: 9px;
border-radius: 0px 0px 100px 100px;
-webkit-box-shadow: 0px 0px 24px 4px #000;
box-shadow: 0px 0px 24px 9px #ffffff;
padding: 0px !important;

[Alex - Rosas † Negras]

I don't want to go below 13 px I know all would be ok but it's too logical

[Bizz]

It's because you are using the ridge as a border, to create the ridge the border property adds the darker inside to create it, the border radius is causing the effect you are having, if you remove the border radius the border will look right as the darker shaow is there to create the ridge effect as is opposite on one side to the other.

[Alex - Rosas † Negras]

I agree with you, but I want it rounded, on the square it gives no problem,this is an impossible thing to fix, just use a dotted and dashed...or decrease border: px

[Bizz]

To do a border without the ridge and using dots you would just write it like this

border:13px dotted #eed255!important

for dashes you just replace the dots with dashed and for solid it would be solid

By the way in your css you also added border top, bottom etc but they will have no effect as you added important to the border at the begining which over rules the other borders.

You have also added the same for padding, the 0px line at the bottom again has no effect as you added important to the padding line above.

You don't need to add webkit to the border radius either as it's supported by all browsers.

This is how the code would look more simplified

#xg_masthead /*Top Image*/ {
margin: auto;
display: block;
height:600px;
width: auto !important;
background: #000 url(https://storage.ning.com/topology/rest/1.0/file/get/9858802674?prof...) center repeat scroll;
border:13px dashed #eed255!important;
padding: 10px 0px 0px 0px !important;
border-radius: 0px 0px 100px 100px;
box-shadow: 0px 0px 24px 9px #ffffff,0px 0px 24px 4px #000;
}

 

[Alex - Rosas † Negras]

thank you very much I come from the times of this site now I put the photo, it was hard to survive now we are very few, every code of mine is weeks of work, every code is a reminder, this is your result with your eyes closed, you are the best only for one reason you are a person with a big heart and help everyone thanks for being a true friend, all ning once was like that.

change all between 2.0 to 3.0 a size even in px, even many photos look different when used in a theme, I would really like to test a 3.0 just for the codes and help people the themes I saw on 3.0 are not to be seen