CODEWITHSUNDEEP
htmlcssjquery-mobile
user2555424
user2555424

Reputation:

jquery mobile -- label, input, text in same line

I've tried much time to put the label, input & text in the same line:

Birth Date _________ *

how to put the "*" in the same line?

HTML:

<div class="wrapper">
  <div class="left text"> Birth Date: </div>
  <div class="content">
    <input type="text" id="bdate" name="bdate"  maxlength="8" />
  </div>
  <div class="right">*</div>
</div>

CSS:

.wrapper {
float: left;
width: 100%;
}

.content {
    margin: 0 75px 0 90px; 
    width: 125px;
}
.left {
    float: left;
    width: 90px; 
}
.text {
    padding-top: 1.0em;
    padding-bottom: 0.7em;
    display: block;
    font-size: 16px;
}
.right {
    float: left;
}

it's also useless to set "float:right" in the CSS .right section.

Anybody helps?

Please do not the way in "jquery", it also doesn't work on "jquery mobile"(1.3.1), thanks a lot!

Upvotes: 0

Views: 3647

Answers (1)

Itay
Itay

Reputation: 16777

You've missed a little thing:

.content {
    margin: 0 75px 0 90px; 
    width: 125px;{
    float: left;            // Added this row
}
.left {
    float: left;
    width: 90px; 
}
.right {
    float: left;
}

Upvotes: 1

Related Questions