blankon91
blankon91

Reputation: 515

How to resize the header text in jQuery Mobile collapsible?

the header text format in collapsible content in jQuery mobile is using <h3> but It's too big for me. So I want to resize default text size in jquery mobile collapsible.

<div data-role="collapsible" data-collapsed="true">
        <h3>My Header</h3>
</div>

how to resize it? Thanks :)

here is my simulation >> http://jsfiddle.net/sevtiandy/seXmc/73/

Upvotes: 2

Views: 4074

Answers (2)

Jorge Con Jota
Jorge Con Jota

Reputation: 489

You could use a class with the h3 element :

<div data-role="collapsible" data-collapsed="true">
    <h3 class="collapse_header">My Header</h3>
</div>

And using your custom CSS resize it:

.collapse_header .ui-btn-text{
    font-size: 10px
}

Upvotes: 0

blankon91
blankon91

Reputation: 515

I solve it. I change the file jquery.mobile-1.1.0.min.css and change the font-size value from 16px to 13px in class .ui-collapsible-heading

Upvotes: 2

Related Questions