Timothy Ruhle
Timothy Ruhle

Reputation: 7597

jQuery Mobile buttons

I am implementing a mobile version of our intranet white pages. It basically allows you to search for people, places and teams. I want the results to be returned through ajax and loaded into a list that looks like this:

-----------------------------------------------
| Staff                                     2 |
-----------------------------------------------
| Person's Name | Phone number |              |
|               |--------------|  Email       |
| Title         | Mobile       |              |
-----------------------------------------------
| Person's Name |              |              |
|               | Phone number |  Email       |
| Title         |              |              |
-----------------------------------------------

The phone/mobile numbers and email are clickable through something like href="tel:" and the name box is clickable for more information.

My problem comes in where there buttons in one row are different heights becuase there is more content in the name box. Does anyone know how to fix this? Example at http://jsfiddle.net/Ruhley/chLSR/

Thanks

Upvotes: 2

Views: 216

Answers (1)

MikeKusold
MikeKusold

Reputation: 1632

I would use CSS, if you are only using buttons for these name cards, you can do this:

.ui-btn {
    height: 50px;
    vertical-align: middle;
}

JSFiddle: http://jsfiddle.net/chLSR/2/

Most likely you are using buttons elsewhere on the page so I would recommend just creating a class such as:

.namecard {
    height: 50px;
    vertical-align: middle;
}

Upvotes: 2

Related Questions