CODEWITHSUNDEEP
jquerycssjquery-mobile
Basic Bridge
Basic Bridge

Reputation: 1911

How to remove round corners in jQuery Mobile?

How to remove the round edges (border-radius) from the particular element or from div tag that is using jQuery Mobile?

Jquery mobile round edges

Upvotes: 15

Views: 25210

Answers (3)

Chuck Boris
Chuck Boris

Reputation: 61

In your css file (any) :

.ui-corner-all {
   -webkit-border-radius:.0 !important;
   border-radius: 0 !important;
}

Upvotes: 6

naota
naota

Reputation: 4718

Talking about buttons, you can apply following option to a button.

data-corners="false"

A code goes like this:

<a href="#" data-role="button" data-corners="false">push me</a>

The document is here: http://jquerymobile.com/demos/1.2.0/docs/buttons/buttons-options.html

Thanks.

Upvotes: 54

rockerest
rockerest

Reputation: 10508

In the jQuery mobile CSS file linked here, search for this string:

.ui-corner-tr {

I don't know if you're even using the default styles, but there's what I found based on the info you provided.

You should be able to change all four corners in that area (as .ui-corner-tr, .ui-corner-tl, .ui-corner-br, .ui-corner-bl, etc., etc.)

Upvotes: 6

Related Questions