By abhi shetty on

Hi,
I have a form rendered using date module containing elements of date repeat module.
I want to style the elements with their positions.
Finding it very difficult to do so.
Is there anything which I can do to style the elements.?

⋅ Categories: Drupal 7.x

Comments

nitin.k’s picture

nitin.k commented

Simple solution will be to take the form id and provide styling in your CSS file.

Or check it out style form.

This also might be helpful.

Thanks

abhi shetty’s picture

abhi shetty commented

Thanks for replying Nitin,
I have a issue with the default rendering of the html by the repeat_date module.
It's rendering the html as:
Div
label :Repeat
"
Every"
textbox
Div

It's displaying Every and the textbox in two different rows.
So how can I get "Every" and the textbox inline??
and how can I have that Every in any selector as it is rendered in the body of the html.??

Thanks.

nitin.k’s picture

nitin.k commented

This is the case when classes are different for textboxes.

<style type="text/css">
.class of first element{
float:left;
width:100px;
}
.class of second element{
float:left;
width:100px;
}
</style>

If classes are same then use the below..

<style type="text/css">
.comman class{
float:left;
width:100px;
}

</style>
abhi shetty’s picture

abhi shetty commented

Hi,
My code is as follows:

<div class="date-clear">
  <div class="form-type-textfield form-item-repeat-date-rrule-weekly-INTERVAL form-item form-group">
  <label for="edit-repeat-date-rrule-weekly-interval--2">Repeats </label>
 " Every "<input placeholder="#" class="form-control form-text" type="text" id="edit-repeat-date-rrule-weekly-interval--2"     name="repeat_date[rrule][weekly][INTERVAL]" value="1" size="3" maxlength="3">" weeks "
  </div>
</div>

This is the code.
I want the label i.e Repeats , "Every" , the textbox , and "weeks" in a single row.
How can I do so.??

Thanks.

nitin.k’s picture

nitin.k commented 

<style type="text/css">
.date-clear label{
 float:left;
}
.date-clear input{
margin: 0;
padding: 0;
}
</style>