How do you make the site more rounded? Like for instance on here http://dofattv.com/

 


Views: 126

Reply to This

Replies to This Discussion

Ceddy,

Most of their "roundness" is accomplished with special images, like this one:

This is done to ensure the round corners will show in all browsers. You can add rounded corners to most any element, but it will only show in FireFox, Chrome (new versions), Safari - - but per usual, not in IE.

 

Just add these attributes to your CSS element. I will add to entire navigation bar, and main body content containers as an example:

#xg_navigation {  -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;
}
#xg_body {  -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;
}

 

You can try this, but I find it unreliable on Ning - - and too tough to install:

http://jonraasch.com/blog/css-rounded-corners-in-all-browsers

 

Otherwise, you have to create custom corner images.

Hope that helps,

Jen

Yes ma'am it did!

 

I have memorized the html skeleton, just still learning some the tweaking properties! I want to be able to give out tips to you guys as well the way you have. I will get there someday :)

I think I got some code for that do you mean
rounding off the edges?

http://www.border-radius.com/

here's is a good gen :)

It's been done to my site now!!!

 

Here's what I did; I took the foundation of Jen told me and applied it to the rest of the html skeleton.

 

#xg_navigation {  -moz-border-radius: 20px;    -webkit-border-radius: 20px;    -khtml-border-radius: 20px;    border-radius: 20px;}

#xg_body {  -moz-border-radius: 20px;    -webkit-border-radius: 20px;    -khtml-border-radius: 20px;    border-radius: 20px;}

.xg_module {  -moz-border-radius: 20px;    -webkit-border-radius: 20px;    -khtml-border-radius: 20px;    border-radius: 20px;}

#xg_foot {  -moz-border-radius: 20px;    -webkit-border-radius: 20px;    -khtml-border-radius: 20px;    border-radius: 20px;}

#xg_masthead {  -moz-border-radius: 20px;    -webkit-border-radius: 20px;    -khtml-border-radius: 20px;    border-radius: 20px;}

.xg_theme {  -moz-border-radius: 20px;    -webkit-border-radius: 20px;    -khtml-border-radius: 20px;    border-radius: 20px;}

#xg {  -moz-border-radius: 20px;    -webkit-border-radius: 20px;    -khtml-border-radius: 20px;    border-radius: 20px;}

 

RSS

Members

© 2024   Created by JenSocial.   Powered by

Badges  |  Report an Issue  |  Terms of Service

Home
VIP Ning Tips