Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I have the following:

enter image description here

I think it's less than ideal because the edit/delete buttons are requiring me to waste a bunch of vertical whitespace within the element.

Options that I can think of:

  • Bring the editable area up to take back that whitespace but then content has a chance of overlapping with the controls, which would be ugly.
  • Same as above but make the controls show up only when the mouse rolls over them, which is something I'd like to avoid (I prefer always-there controls), but it seems like the best compromise out of everything I can think of
  • Move the controls above or to the right of the box - wasting whitespace from the layout instead of the element
  • change the way the controls work by using a select-then-edit model, but this still requires a checkbox to be placed somewhere, resulting in the same problem.

Where to these controls belong when the space within the element is so valuable?

share|improve this question
add comment

1 Answer

up vote 4 down vote accepted

Why not place an edit tab at the bottom and then display the edit/delete buttons when it expands up? Users will be entering their code from the top and this tab will not interfere with the content since it will always be on the same line as the next line of code. The bottom line of the visible area will always be blank since the content will shift up...

mockup

download bmml source – Wireframes created with Balsamiq Mockups

I could be totally misunderstanding your question though.

share|improve this answer
    
I like it. Thanks hey –  RobVious Jun 7 '13 at 2:04
    
Glad i could help! :) –  rubysoho Jun 7 '13 at 15:37
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.