use center-aligned hboxes to makes labels and textboxes etc. line up nicely

diff --git a/xulapp/chrome/mandelbrot/content/image-settings.xul b/xulapp/chrome/mandelbrot/content/image-settings.xul
index 3fc332f3ef8845d6a0cf237beb7d12b5b837eafb..605aac20a07f8b754936dc2b7a208a04f7c512b9 100644 (file)
--- a/xulapp/chrome/mandelbrot/content/image-settings.xul
+++ b/xulapp/chrome/mandelbrot/content/image-settings.xul
@@ -76,7 +76,7 @@
     <groupbox>
       <caption label="&coord.title;"/>
       <description value="&coord.real.label;"/>
-      <hbox>
+      <hbox align="center">
         <label value="&coord.min.label;" control="Cr_min"/>
         <textbox id="Cr_min" size="10"
                  preference="mandelbrot.last_image.Cr_min"
@@ -90,7 +90,7 @@
                  onchange="recalcCoord('Cr', 'max');"/>
       </hbox>
       <description value="&coord.imag.label;"/>
-      <hbox>
+      <hbox align="center">
         <label value="&coord.min.label;" control="Ci_min"/>
         <textbox id="Ci_min" size="10"
                  preference="mandelbrot.last_image.Ci_min"
@@ -108,13 +108,13 @@
     <hbox flex="1">
       <groupbox>
         <caption label="&img.size.title;"/>
-        <hbox>
+        <hbox align="center">
           <label value="&img.width.label;" control="imgWidth"/>
           <textbox id="imgWidth" size="4"
                    preference="mandelbrot.image.width"
                    onchange="recalcCoord('Ci', 'scale');"/>
         </hbox>
-        <hbox>
+        <hbox align="center">
           <label value="&img.height.label;" control="imgHeight"/>
           <textbox id="imgHeight" size="4"
                    preference="mandelbrot.image.height"
@@ -132,7 +132,7 @@
 
       <groupbox>
         <caption label="&options.title;"/>
-        <hbox>
+        <hbox align="center">
           <checkbox id="syncProp"
                     preference="mandelbrot.syncProportions"
                     onclick="checkProportions();"/>