I have a set of automatically generated div containers that contain label and data information.
For example:
<div class="display-label">
@Html.DisplayNameFor(model => model.BusinessPhone)
</div>
<div class="display-field">
@Html.DisplayFor(model => model.BusinessPhone)
</div>
<div class="display-label">
@Html.DisplayNameFor(model => model.Email)
</div>
<div class="display-field uri">
@Html.DisplayFor(model => model.Email)
</div>
Here is the corresponding CSS code:
div.display-label{
display: inline-block;
float: left;
width: 9em;
}
div.display-field{
display: inline-block;
width: 10em;
min-height: 1em;
float: left;
}
My goal is to have any div with the "uri" class ignore previously set width properties and flow naturally like an unstyled div. I still want to maintain the original "display-field" class for its consistent styling across all fields.
div.uri{
width:**Clear**
}