Re: [Kimchi-devel] [PATCH] Bugfix#: Prevent overlap issue occurs under General tab on Edit

From: Wen Wang <wenwang(a)linux.vnet.ibm.com&gt; This patch fix the bug that occurs when changing languages which might contain long words that cause problems of layout in "General" tab under "Edit" for VM. Signed-off-by: Wen Wang <wenwang(a)linux.vnet.ibm.com&gt; --- ui/css/theme-default/guest-edit.css | 10 ++++---- ui/pages/guest-edit.html.tmpl | 38 +++++++++++++++------------------- 2 files changed, 22 insertions(+), 26 deletions(-) diff --git a/ui/css/theme-default/guest-edit.css b/ui/css/theme-default/guest-edit.css index f6cf214..75032c6 100644 --- a/ui/css/theme-default/guest-edit.css +++ b/ui/css/theme-default/guest-edit.css @@ -33,6 +33,10 @@ padding: 1em; } +#form-guest-edit-general .edit-general-inline { + display: inline-block; +} + #form-guest-edit-storage input[readonly] { background: none; border-color: transparent; @@ -43,16 +47,12 @@ padding-right: 0; } -.guest-edit-wrapper-label, .guest-edit-wrapper-controls { - display: inline-block; -} - .guest-edit-wrapper-label { height: 38px; line-height: 38px; margin-top: 5px; vertical-align: top; - width: 100px; + min-width: 100px; } #form-guest-edit-storage .guest-edit-wrapper-label { diff --git a/ui/pages/guest-edit.html.tmpl b/ui/pages/guest-edit.html.tmpl index 0eaa08d..3003ab1 100644 --- a/ui/pages/guest-edit.html.tmpl +++ b/ui/pages/guest-edit.html.tmpl @@ -44,48 +44,44 @@ </ul> <form id="form-guest-edit-general"> <fieldset class="guest-edit-fieldset"> - <div> + <div class="edit-general-inline"> <div class="guest-edit-wrapper-label"> <label for="guest-edit-id-textbox"> $_("Name") </label> </div> - <div class="guest-edit-wrapper-controls"> - <input id="guest-edit-id-textbox" - name="name" type="text" /> - </div> - </div> - <div> <div class="guest-edit-wrapper-label"> <label for="guest-edit-cores-textbox"> $_("CPUs") </label> </div> + <div class="guest-edit-wrapper-label"> + <label for="guest-edit-memory-textbox"> + $_("Memory (MB)") + </label> + </div> + <div class="guest-edit-wrapper-label"> + <label for="guest-edit-icon-textbox"> + $_("Icon") + </label> + </div> + </div> + <div class="edit-general-inline"> + <div class="guest-edit-wrapper-controls"> + <input id="guest-edit-id-textbox" + name="name" type="text" /> + </div> <div class="guest-edit-wrapper-controls"> <input id="guest-edit-cores-textbox" name="cpus" type="text" /> </div> - </div> - <div> - <div class="guest-edit-wrapper-label"> - <label for="guest-edit-memory-textbox"> - $_("Memory (MB)") - </label> - </div> <div class="guest-edit-wrapper-controls"> <input id="guest-edit-memory-textbox" name="memory" type="text" /> </div> - </div> - <div> - <div class="guest-edit-wrapper-label"> - <label for="guest-edit-icon-textbox"> - $_("Icon") - </label> - </div> <div class="guest-edit-wrapper-controls"> <input id="guest-edit-icon-textbox"