How to make Rounded Corners for TAble in Master Page

Question

0.00/5 (No votes)

See more:

Am working on ASP.Net C#, SqlServer 2005.

I have Created a Website with Page width = 1000. NOW i need Rounded Corners for every page. I need to set in Master Page of the Website.

I have Already set Borderradius:20px; but am not getting.

This is my css code.

CSS

.table
{
border-radius:20px;
-webkit-border-radius:20px;
}

and finally added this as in TABLE..... Class="table"

But its not working...Please help me...it should be implement in MASTER PAGE.

Please can you suggest me how to do this.

Thanks in Advance.

Posted 1-Jul-12 19:26pm

Ranjith Reddy CSE

Updated 1-Jul-12 19:29pm

Ganesan Senthilvel

v2

Add a Solution

Comments

Ganesan Senthilvel 2-Jul-12 1:30am

CSS format

5 solutions

Solution 1

There is a work around trick to generate the rounded corner tables. Sample HTML code is available at http://www.sitepoint.com/trick-rounded-corner-tables/#.T_Ex19lYqjE[^]

Posted 1-Jul-12 19:32pm

Ganesan Senthilvel

Solution 2

Look here:
Practical CSS3 tables with rounded corners[^]
CSS Rounded Corners In All Browsers (With No Images)[^]

Posted 1-Jul-12 19:34pm

Sandeep Mewara

Solution 3

You can use RoundedCorners of Ajax Control toolkit. quite easy to implement and compatible to all browsers
For using ajax you have to add reference of AjaxControllToolkit.dll.

Example:

ASP.NET

<div id="divround"  runat="server" style="width:500px">Your design here</div>

ASP.NET

<ajaxToolkit:RoundedCornersExtender ID="rce" runat="server"
    TargetControlID="divround"
    Radius="6"
    Corners="All" />

Make it answer if it suits to your requirement.
Thanks

Posted 1-Jul-12 19:35pm

AshishChaudha

Updated 1-Jul-12 20:05pm

v2

Comments

Ranjith Reddy CSE 2-Jul-12 1:39am

how to add reference of AjaxControllToolkit.dll......am fresher please tell me. THANKS.

AshishChaudha 2-Jul-12 1:43am

Which framework of asp.net are you using?? Please check following link for how to add reference

http://weblogs.asp.net/yousefjadallah/archive/2010/04/16/installing-ajax-control-toolkit-4-in-visual-studio-2010.aspx

Ranjith Reddy CSE 2-Jul-12 2:54am

am using 3.5 version IDE VS 2008

AshishChaudha 2-Jul-12 3:03am

Check out the link below:

http://ajaxcontroltoolkit.codeplex.com/releases/view/90063

check out and add reference following the previous link.

Thanks

Solution 4

try

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

http://stackoverflow.com/questions/4932181/rounded-table-corners-css-only[^]

or

http://www.google.co.in/#hl=en&safe=active&sclient=psy-ab&q=rounded+corners+of+table+with+css&oq=rounded+corners+of+table+with+css&gs_l=hp.3..0i22.13554.16081.1.16329.9.9.0.0.0.0.452.1864.0j3j2j0j2.7.0...0.0.cTkMlotWSco&pbx=1&bav=on.2,or.r_gc.r_pw.r_qf.,cf.osb&fp=df4f14c76f997e44&biw=1024&bih=598[^]

Posted 1-Jul-12 19:35pm

Sharma Richa

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

_Amy · Accepted Answer · 2012-07-01T20:05:00

Solution 5

Hi,
Use this class for table:

CSS

.table
{
    border:1px solid #92b7d0;
    padding:10px 40px;
    background:#E2E8F1; /*#f6f6f6;#dddddd;a1a1a1*E2E8F1*/
    width:100%;
     border-radius:8px;
    -moz-border-radius:8px; /*Firefox 3.6 and earlier */
}

--Amit

Posted 1-Jul-12 20:05pm

_Amy

Comments

Ranjith Reddy CSE 2-Jul-12 3:08am

Thank you Sir, Now its Working According to your Code. MANY THANKS.

Ranjith Reddy CSE 2-Jul-12 3:09am

But its now working in Internet Explorer.
Only its working fine in GOOGLE CHROME.

Please say how to do this with internet explorer.

Ranjith Reddy CSE 2-Jul-12 3:09am

Sorry, Its not working in Internet Explorer.

_Amy 2-Jul-12 3:27am

Yes.. It'll not work in IE. For that you need to use RoundedCornerExtender asp.net ajax. search in google. Anyway it'll work in IE9.