5

Is there a way to make a collapsible element/set in jQuery Mobile not inset? By default it makes the collapsible element as an inset item.

data-inset="false" does not alter the behavior.

Jasper
  • 74,169
  • 13
  • 144
  • 142
cjcee
  • 75
  • 2
  • 7

2 Answers2

8

If you give the margin-left and margin-right properties a negative value you can expand the collapsible content to the width of the page.

The default margin-top and margin-bottom values for a collapsible are 8px so we can write a CSS rule for this:

.ui-collapsible {
    margin : 8px -15px;
}

I chose -15px because that is the negative amount of padding that the data-role="content" element adds to each page.

Here is a jsfiddle to view what this does: http://jsfiddle.net/jasper/zSvqU/

Jasper
  • 74,169
  • 13
  • 144
  • 142
0

You could always put the collapsible content block in data-role="header", but of course this is only okay if your collapsible content doesn't need to be somewhere in the middle of your page.

Cary Hartline
  • 500
  • 1
  • 4
  • 20