Home/ Questions/Q 8606537
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-12T03:06:54+00:00

I’m loading my css after jQuery Mobile’s css file: <head> <link rel=stylesheet href=…/1.1.1/jquery.mobile-1.1.1.min.css />

  • 0

I’m loading my css after jQuery Mobile’s css file:

<head>
    <link rel="stylesheet" href=".../1.1.1/jquery.mobile-1.1.1.min.css" />
    <link rel="stylesheet" href="main.css" />
</head>

But my margin attribute always get overwritten:

firebug showing overwritten margin attribute

Is jquery’s css getting loaded dynamically after mine somehow?
I’ve tried using ThemeRoller but it is too simple, I can’t change the margins.

Thanks!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The reason why your CSS is getting overwritten is because the jQuery’s CSS is more accurate with its selectors.

    You say that all items with class .ui-radio should have margin, which is taken first, then all items with .ui-radio that are inside .ui-controlgroup-vertical have a set margin too.

    A simple trick would be to make sure to use the same selector, .ui-controlgroup-vertical .ui-radio in this case, this should do the trick if your CSS is loaded after. Else, use one more parent container and you will be fine.

    Little read to make it clearer: http://www.w3.org/wiki/CSS/Training/Priority_level_of_selector

    • 0