How to make buttons same theme as their parent element?

Question

I am working on jQuery mobile project.

In ui-footer and ui-header I have some buttons I want the buttons to be the same theme as ui-footer and ui-header theme.

Here is ui-footer and ui-header css style:

.ui-page .ui-footer,
.ui-page .ui-header {
    border: 1px solid #333 !important;
    background: #111 !important;
    color: #fff !important;
    font-weight: bold !important;
    text-shadow: 0 -1px 1px #000 !important;
    background-image: -webkit-gradient(linear, left top, left bottom, from( #3c3c3c ), to( #111 )) !important;
    background-image: -webkit-linear-gradient( #3c3c3c, #111 ) !important;
    background-image: -moz-linear-gradient( #3c3c3c, #111 ) !important;
    background-image: -ms-linear-gradient( #3c3c3c, #111 ) !important;
    background-image: -o-linear-gradient( #3c3c3c, #111 ) !important;
    background-image: linear-gradient( #3c3c3c, #111 ) !important;
}

Here how it looks in the view:

I need to make the home button and all other buttons inside ui-footer and ui-header the same theme as ui-footer and ui-header.

I know that I can use data-theme attribute but if I use this attribute I have to put it in each button in ui-footer or ui-header.

Is there way to define styling in css file to make all buttons make the same theme like ui-footer and ui-header(like their parent element).

http://stackoverflow.com/questions/7924665/change-the-default-data-theme-from-jquery-mobile — Gjermund Dahl, Mar 24 '16 at 13:12

How to make buttons same theme as their parent element?

0 Answers0