Rounded Edges *Andrew Please Help*

Author Comment
User avatar

Posts: 41

Location: Michigan

This is the ole style code to make the borders round. Can you help me make them round with the new code?

body {
font-family: Lilly, "Comic Sans MS";
font-size: 15px;
color: #852834;
background: url(http://i63.photobucket.com/albums/h137/ ... ound_1.gif);
}

.mgr-navigation-sliver { color: #F9EEC9; background: url(http://i63.photobucket.com/albums/h137/ ... ound_2.jpg); }

.mgr-navigation-sliver a:link { color: #F9EEC9; text-decoration: none; font-weight: bold; }

.mgr-navigation-sliver a:visited { color: #F9EEC9; }

th {
color: #F9EEC9;
font-family: Lilly, "Comic Sans MS";
font-size: 15px;
background: url(http://i63.photobucket.com/albums/h137/ ... ound_2.jpg);
}

th a:link { color: #F9EEC9; }

a { color: #2F4236; text-decoration: none; }

a:link { color: #2F4236; text-decoration: none; }

a:visited { color: #2F4236; text-decoration: none; }

a:hover { color: #2F4236; text-decoration: none; }

a:active { color: #2F4236; text-decoration: none; }

.boxheading { color: #F9EEC9; padding: 3px; background: url(http://i63.photobucket.com/albums/h137/ ... ound_2.jpg); }

.boxheading a:link { color: #F9EEC9; }

.boxheading h1 { font-size: 15px; font-family: Lilly, "Comic Sans MS"; }

.boxheading h2 { font-size: 15px; font-family: Lilly, "Comic Sans MS"; }

.boxheading h3 { font-size: 15px; }

.category-box table { border: 1px dashed #852834; }

.category-box th { border: 1px dashed #852834; }

.category-box td { border: 1px dashed #852834; }

.forum-box table { border: 1px dashed #852834; }

.forum-box th { border: 1px dashed #852834; }

.forum-box td { border: 1px dashed #852834; font-size: 15px; }

.discussion-box table { border: 1px dashed #852834; }

.discussion-box th { border: 1px dashed #852834; }

.discussion-box td { border: 1px dashed #852834; }

.discussion-box .post-content { font-family: Lilly, "Comic Sans MS"; font-size: 17px; text-align: center; }

blockquote {
color: #852834;
border: 1px dashed #852834;
font-family: Lilly, "Comic Sans MS";
font-size: 16px;
text-align: center;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
padding: 7px;
background: #F1ECDB;
}

textarea {
color: #852834;
border: 1px dashed #852834;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
font-weight: normal;
font-family: Lilly, "Comic Sans MS";
font-size: 17px;
text-align: center;
background: url(http://i63.photobucket.com/albums/h137/ ... ound_4.gif);
}

.button {
color: #F9EEC9;
border: none;
font-family: Lilly, "Comic Sans MS";
font-size: 15px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
padding: 3px;
background: url(http://i63.photobucket.com/albums/h137/ ... ound_2.jpg);
}

input.text {
color: #F9EEC9;
border: 1px dashed #F9EEC9;
font-family: Lilly, "Comic Sans MS";
font-size: 16px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
background: url(http://i63.photobucket.com/albums/h137/ ... ound_2.jpg);
}

.dropdown li {
border: 1px dashed #852834;
font-size: 11px;
margin: 1px;
*vertical-align: bottom;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
background: #F1ECDB;
}

.pager-total { border: 1px solid #852834; background: #F1ECDB; }

.pager-list div { border: 1px solid #852834; background: #F1ECDB; }

.moderator-list { display: none; }

.topics { display: none; }

.posts { display: none; }

.kudos { display: none; }

.views { display: none; }

.tags-box { display: none; }

.post-tags { display: none; }

.edit-info { display: none; }

div.mgr-navigation-sliver a:visited { color: #F9EEC9; text-decoration: none; font-weight: bold; }

div.mgr-navigation-sliver a:hover { text-decoration: none; }

div.mgr-left-col p.welcome-message { font-weight: bold; }

div.mgr-navigation-sliver-wrapper { border: none; }

div.mgr-navigation-sliver { border: none; }

div.mgr-right-col p.mgr-sliver-open-button { background: transparent; }

div.mgr-right-col p.mgr-sliver-open-button a:link { border: 0px; font-weight: bold; background: transparent; }

div.mgr-right-col p.mgr-sliver-open-button a:hover { color: #B3B29E; }

html>/**/body { font-size: 15px; }

#wrapper { font-size: 15px; }

.bread-crumbs { font-family: Lilly, "Comic Sans MS"; font-weight: bold; font-size: 15px; }

.tool-box .boxbody h2 { font-family: Lilly, "Comic Sans MS"; font-size: 15px; }

.tool-box .boxbody h3 { font-family: Lilly, "Comic Sans MS"; font-size: 15px; }

.discussion-box .poster-name { font-family: Lilly, "Comic Sans MS"; }

.discussion-box .post-title { font-family: Lilly, "Comic Sans MS"; }

.post-box label { font-family: Lilly, "Comic Sans MS"; }

.forumtitle h3 { font-family: Lilly, "Comic Sans MS"; font-size: 15px; }

th h2 { font-size: 15px; }

.th { font-size: 15px; }

h4.description { font-size: 15px; }

.topic-pager { font-size: 15px; }

h1 { font-size: 15px; }

h2 { font-size: 15px; }

h3 { font-size: 15px; }

h4 { font-size: 15px; }

h5 { font-size: 15px; }

h6 { font-size: 15px; }

.announcement-box { font-size: 15px; }

.post-content { font-size: 15px; }

.post-tools { font-size: 15px; }

h3.quote-title { font-size: 15px; }

label { font-size: 15px; }

.pager { font-size: 15px; }

.previous-topic { background: #F1ECDB; }

.next-topic { background: #F1ECDB; }

a.previous-month { background: #F1ECDB; }

a.next-month { background: #F1ECDB; }

.stats-box .boxbody { padding-top: 5px; padding: 3px; }

#directory_default .control-box a:link { font-size: 15px; }

#directory_default .control-box .button { font-size: 15px; }

.post-box .post-options label { font-family: Lilly, "Comic Sans MS"; font-size: 1em; font-weight: normal; }

.bord1 {
width: 95%;
margin: 20px auto;
padding: 8px;
-moz-border-radius: 60px;
-webkit-border-radius: 60px;
background: url(http://i63.photobucket.com/albums/h137/ ... ound_2.jpg);
}

.bord2 { padding: 15px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
background: url(http://i63.photobucket.com/albums/h137/ ... ound_3.jpg); }

.bord3 { padding: 8px;
-moz-border-radius: 40px;
-webkit-border-radius: 40px;background: url(http://i63.photobucket.com/albums/h137/ ... ound_2.jpg); }

.mycontent { padding: 15px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
background: url(http://i63.photobucket.com/albums/h137/ ... ound_1.gif); }

.tool-box .boxbody { padding: 3px; }

.legend-box .boxbody { padding: 3px; }

.whosonline-box .boxbody { padding: 3px; }

.announcement-box .boxbody { padding: 3px; }

.tags-box .boxbody { padding: 3px; }

.reply-box .boxbody { padding: 3px; }

table { border-collapse: separate; border-spacing: 1px; }

.dropdown li input { color: #852834; }

.dropdown .button { padding: 5px; }

.boxheading a:visited { color: #F9EEC9; }

th a:visited { color: #F9EEC9; }

td { background: url(http://i63.photobucket.com/albums/h137/ ... ound_4.gif); }

.extra-content .boxbody { background: url(http://i63.photobucket.com/albums/h137/ ... ound_4.gif); }

.control-box .boxbody { background: transparent; }

.control-box { border: 0px; }

.credit { font-weight: bold; }

.discussion-box td.th { color: #F9EEC9; background: url(http://i63.photobucket.com/albums/h137/ ... ound_2.jpg); }

.discussion-box td.th a { color: #F9EEC9; }

.wysiwyg-editor {
color: #852834;
font-family: Lilly, "Comic Sans MS";
font-size: 17px;
background: #F1ECDB;
}

User avatar

Admin

Posts: 11073

If I am understanding correctly, not really. One would really have to start over using both the code and the look of the original as a guide towards replicating it as much as possible on the responsive layout, which is much more restricted in what can be done with it.

P.S. Next time you post code please insert it in code tags so it renders better, is easier to read and does not break.
[code]Your content here[/code]

User avatar

Posts: 41

Location: Michigan

Becky, helped me with those codes *which no longer work rounding the edges*.
I was wondering if there was a code like you did for SDS board to make the rounding edges.
Sorry, not putting in codes for you.

User avatar

Admin

Posts: 11073

Nabeela, I am so out of touch and am not understanding. Should I know what "SDS board" is?

Let me read your first question again, then try and gain something from the CSS...

I'm thinking the same again. Are you trying to convert a tables-layout skin so it will work on the responsive design?

Round corners... Let me look at your CSS...

Oh! Are you saying that it did work and now doesn't?

Every place you have:
-moz-border-radius: «number»px;
-webkit-border-radius: «number»px;

either change it to:
-moz-border-radius: «number»px;
-webkit-border-radius: «number»px;
border-radius: «number»px;

or simply replace with:
border-radius: «number»px;

These are all rounded.
    blockquote
    textarea
    .button
    input.text
    .dropdown li
    .bord1
    .bord2
    .bord3
    .mycontent
On responsive design, .mycontent, .bord1, .bord2, .bord3 cannot exist. The rest should be dealable. There are also other ways of creating .mycontent, .bord1, .bord2, .bord3 to some extent.

User avatar

Posts: 41

Location: Michigan

Thank you for your help Andrew.

User avatar

Admin

Posts: 11073

I'm still not sure what the problem was and if I came up with a solution or not! :rollin

User avatar

Posts: 41

Location: Michigan

When Becky helped me a few years ago it worked and then the codes stopped working.
I tried the codes again and they worked today and I don't know why. You did help because I know now if the codes stop working what to add.

User avatar

Admin

Posts: 11073

OK, to explain, the first option I gave was (I say was because this is no longer done) the correct way to implement border-radius, taking into consideration that it would become a future standard. It was not supported by IE at that time but it was expected. Nowadays, nobody bothers with the vendor prefixes. Just use one line instead of 3 (or in that skin's case, 2).

From memory you are a Google Chrome user. The chances are that there was a Chrome update which neglected to implement the vendor prefix (-webkit-). It could well have been dropped as unnecessary and obsolete. You should update that skin anyway because those with IE/Edge are seeing it square. I'm suggesting you use the 2nd option because vendor prefixes are unnecessary for all current browsers insofar as border-radius is concerned.

Why did it start working again? You got a ghost? You applied a different version of that skin? Something else was broken? Another Chrome update which (temporarily) fixed the issue? Who knows?

Display posts from previous:  Sort by  



Who is online

Users browsing this forum: No registered users and 2 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
Jump to:  
cron
Powered by phpBB® Forum Software © phpBB Group