CODEWITHSUNDEEP
htmlcss
dragonfly
dragonfly

Reputation: 17773

Force empty block element to have a width

I'm using inplace edit plugin that needs a block element in order to know which element is editable when clicked. I've done it that way in ASP .NET:

<div class="editable-alias" style="background-color: red; width: 100%;"><%# ViewModel.Alias %></div>

However if ViewModel.Alias is empty, then surrounding <div> is empty, and as a result its width is 0, and it's impossible to click it. Is there a way to style that div (or perhaps span with inline-block) to have width even if it do not have content?

Upvotes: 1

Views: 3168

Answers (1)

Alfred
Alfred

Reputation: 21406

Try;

<div class="editable-alias" style="display:block; background-color: red; width: 100%;"><%# ViewModel.Alias %>&nbsp;</div>

You may also specify a min-height along with this

Upvotes: 1

Related Questions