CODEWITHSUNDEEP
htmlcss
John S
John S

Reputation: 8341

Clearing a CSS styled div width back to unlimited width

I have a series of auto generated divs that hold label and data info.

i.e.

<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>

The CSS:

div.display-label{
display: inline-block;
float: left;
width: 9em;
}
div.display-field{
display: inline-block;
width: 10em;
min-height: 1em;
float: left;
}

What I would like to do is have any div with the uri class remove any previously set width and let the width float like an unstyled div. I would like to keep the original "display-field" class too because it contains additional styles that I want to be consistent for all fields.

div.uri{
   width:**Clear**
}

Upvotes: 0

Views: 635

Answers (2)

Derek Henderson
Derek Henderson

Reputation: 9706

div.uri {
    width: auto;
}

And make sure this style is declared after the other class styles.

Upvotes: 1

cimmanon
cimmanon

Reputation: 68319

The default width of any given element is typically auto:

div.uri {
   width: auto;
}

Upvotes: 1

Related Questions