I created a view in Drupal 7 that displays some user fields. I'm currently using an unformatted list layout, but I'm not very pleased with the way it looks.
I'd like to display the field labels ("Name", "Age" and "Country") and the field values ("Jeroen", "19" and "Belgium") in my view in two columns, both outlined at the left.
I know how to remove the colons, but I don't have a clue about how to separate the field labels and values. How can I do that?
Edit: Giving Ajay's answer a try, I now have the following code:
<div>
<div class = "user-label">Name</div>
<div class ="user-value">[field_name]</div>
</div>
<div>
<div class = "user-label">Age</div>
<div class ="user-value">[field_age]</div>
</div>
<div>
<div class = "user-label">Country</div>
<div class ="user-value">[field_country]</div>
</div>
This is the styling:
.user-label{
float:left;
font-weight: bold;
}
.user-value{
float:left;
margin-left: 20px;
}
That doesn't look very pretty however. How can I align the values nicely in two columns?
Thanks for the updated HTML structure. You could go with float :
<!--language:css-->.user-label {
float:left;
clear:left;
width:5em;/* tune this, you may other div for input too*/
}