You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@myfaces.apache.org by lo...@apache.org on 2009/07/30 16:51:05 UTC

svn commit: r799297 - in /myfaces/tobago/trunk: example/test/src/main/webapp/tc/box/ theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/msie/style/ theme/scarborough/src/main/resources/org/apache/myfaces/tobago/re...

Author: lofwyr
Date: Thu Jul 30 14:51:05 2009
New Revision: 799297

URL: http://svn.apache.org/viewvc?rev=799297&view=rev
Log:
TOBAGO-606: Layout-Manager
 - changing the box-sizing model from border-box to content-box.
   border-box is that, what the Tobago layout manager is doing, but can't be realized in a standard complient way with current browsers, until the fully implement CSS3.

Modified:
    myfaces/tobago/trunk/example/test/src/main/webapp/tc/box/box.xhtml
    myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/msie/style/style.css
    myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/property/tobago-theme-config.properties
    myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/style/style.css
    myfaces/tobago/trunk/theme/speyside/src/main/java/org/apache/myfaces/tobago/renderkit/html/speyside/standard/tag/BoxRenderer.java
    myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/mozilla/style/style.css
    myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/msie/style/style.css
    myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/property/tobago-theme-config.properties
    myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/style/style.css

Modified: myfaces/tobago/trunk/example/test/src/main/webapp/tc/box/box.xhtml
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/example/test/src/main/webapp/tc/box/box.xhtml?rev=799297&r1=799296&r2=799297&view=diff
==============================================================================
--- myfaces/tobago/trunk/example/test/src/main/webapp/tc/box/box.xhtml (original)
+++ myfaces/tobago/trunk/example/test/src/main/webapp/tc/box/box.xhtml Thu Jul 30 14:51:05 2009
@@ -26,17 +26,22 @@
     <f:facet name="layout">
       <tc:gridLayout/>
     </f:facet>
-    <tc:gridLayoutConstraint width="500px" height="500px"/>
+    <tc:gridLayoutConstraint width="500px" height="200px"/>
 
-    <tc:box label="A simple box">
+    <tc:box id="box" label="A simple box">
       <f:facet name="layout">
         <tc:gridLayout/>
       </f:facet>
 
-      <tc:textarea  
+      <tc:textarea id="textarea"
           value="Some text without label, some text without label, some text without label, some text without label, some text without label, some text without label, some text without label, some text without label, some text without label, some text without label, ..."/>
 
     </tc:box>
 
+    <tc:script file="script/test-utils.js"/>
+
+    <tc:script onload="checkLayout('page:box', 0, 0, 500, 200);"/>
+    <tc:script onload="checkLayout('page:textarea', 6, 26, 487, 167);"/>
+
   </tc:page>
 </f:view>

Modified: myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/msie/style/style.css
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/msie/style/style.css?rev=799297&r1=799296&r2=799297&view=diff
==============================================================================
--- myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/msie/style/style.css (original)
+++ myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/msie/style/style.css Thu Jul 30 14:51:05 2009
@@ -40,11 +40,6 @@
   margin-bottom: -1px;
 }
 
-.tobago-textArea-default {
-  margin-top: -1px;
-  margin-bottom: -1px;
-}
-
 .tobago-in-default {
   margin-top: -1px;
   margin-bottom: -1px;

Modified: myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/property/tobago-theme-config.properties
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/property/tobago-theme-config.properties?rev=799297&r1=799296&r2=799297&view=diff
==============================================================================
--- myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/property/tobago-theme-config.properties (original)
+++ myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/property/tobago-theme-config.properties Thu Jul 30 14:51:05 2009
@@ -70,6 +70,16 @@
 
 Image.headerHeight=0
 
+In.css.border-left-width=2
+In.css.border-top-width=2
+In.css.border-right-width=2
+In.css.border-bottom-width=2
+
+In.css.padding-left=0
+In.css.padding-top=0
+In.css.padding-right=0
+In.css.padding-bottom=0
+
 MenuBar.headerHeight=22
 MenuBar.fixedHeight=24
 
@@ -114,6 +124,16 @@
 
 TextArea.headerHeight=0
 
+TextArea.css.border-left-width=2
+TextArea.css.border-top-width=2
+TextArea.css.border-right-width=2
+TextArea.css.border-bottom-width=2
+
+TextArea.css.padding-left=0
+TextArea.css.padding-top=0
+TextArea.css.padding-right=0
+TextArea.css.padding-bottom=0
+
 Time.fixedWidth=105
 
 SelectOneRadio.fixedHeight=20

Modified: myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/style/style.css
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/style/style.css?rev=799297&r1=799296&r2=799297&view=diff
==============================================================================
--- myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/style/style.css (original)
+++ myfaces/tobago/trunk/theme/scarborough/src/main/resources/org/apache/myfaces/tobago/renderkit/html/scarborough/standard/style/style.css Thu Jul 30 14:51:05 2009
@@ -368,8 +368,6 @@
 /* XXX was changed from 5px */
   padding-top: 0px;
   overflow: hidden;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box;
 }
 
 div.tobago-gridLayout-first-row {
@@ -410,13 +408,6 @@
   -moz-box-sizing: border-box;
 }
 
-div.tobago-box-default {
-  overflow: auto;
-  position: relative;
-  top: 0px;
-  left: 0px;
-}
-
 /* label ------------------------------------------------------------------- */
 
 div.tobago-label-markup-number {

Modified: myfaces/tobago/trunk/theme/speyside/src/main/java/org/apache/myfaces/tobago/renderkit/html/speyside/standard/tag/BoxRenderer.java
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/theme/speyside/src/main/java/org/apache/myfaces/tobago/renderkit/html/speyside/standard/tag/BoxRenderer.java?rev=799297&r1=799296&r2=799297&view=diff
==============================================================================
--- myfaces/tobago/trunk/theme/speyside/src/main/java/org/apache/myfaces/tobago/renderkit/html/speyside/standard/tag/BoxRenderer.java (original)
+++ myfaces/tobago/trunk/theme/speyside/src/main/java/org/apache/myfaces/tobago/renderkit/html/speyside/standard/tag/BoxRenderer.java Thu Jul 30 14:51:05 2009
@@ -29,8 +29,9 @@
 import org.apache.myfaces.tobago.ajax.api.AjaxUtils;
 import org.apache.myfaces.tobago.component.Attributes;
 import org.apache.myfaces.tobago.component.Facets;
-import org.apache.myfaces.tobago.component.SupportsMarkup;
+import org.apache.myfaces.tobago.component.UIBox;
 import org.apache.myfaces.tobago.component.UIToolBar;
+import org.apache.myfaces.tobago.layout.PixelMeasure;
 import org.apache.myfaces.tobago.renderkit.BoxRendererBase;
 import org.apache.myfaces.tobago.renderkit.html.HtmlConstants;
 import org.apache.myfaces.tobago.renderkit.html.HtmlStyleMap;
@@ -57,80 +58,94 @@
     HtmlRendererUtil.renderDojoDndSource(facesContext, component);
   }
 
+  /*
+<div class="tobago-box-default" style="width: 100px; height: 100px">
+  <div class="tobago-box-shadow" style="width: 99px; height: 99px">
+    <div class="tobago-box-border" style="width: 97px; height: 97px">
+      <div class="tobago-box-header">
+        <span class="tobago-box-header-label">Label</span>
+      </div>
+    </div>
+  </div>
+            <div style="position: absolute; top: 26px; left: 6px; width: 87px; height: 67px; background-color: blue;">
+            Content
+            </div>
+</div>
+
+   */
   @Override
   public void encodeBegin(FacesContext facesContext, UIComponent component) throws IOException {
 
     TobagoResponseWriter writer = HtmlRendererUtil.getTobagoResponseWriter(facesContext);
-    HtmlStyleMap style = (HtmlStyleMap) component.getAttributes().get(Attributes.STYLE);
-
-    if (style != null) {
-      Integer styleHeight = style.getInt("height");
-      if (styleHeight != null) {
-        style.put("height", styleHeight-1);
-      }
-    }
+    UIBox box = (UIBox) component;
 
-    String clientId = component.getClientId(facesContext);
-    writer.startElement(HtmlConstants.DIV, component);
-    HtmlRendererUtil.renderDojoDndItem(component, writer, true);
+    String clientId = box.getClientId(facesContext);
+    writer.startElement(HtmlConstants.DIV, box);
+    HtmlRendererUtil.renderDojoDndItem(box, writer, true);
     writer.writeClassAttribute();
     writer.writeIdAttribute(clientId);
-//    if (style != null) {
-      writer.writeStyleAttribute(style);
-//    }
-    // XXX what is abrout the writeStyleAttribute(style) method? is it useful or should it be deprecated?
     writer.writeStyleAttribute();
     writer.writeJavascript("Tobago.addAjaxComponent(\"" + clientId + "\");");
-    
-    encodeBeginInner(facesContext, writer, component);
+    encodeBox(facesContext, writer, box);
   }
 
-  private void encodeBeginInner(FacesContext facesContext,
-      TobagoResponseWriter writer, UIComponent component) throws IOException {
-    HtmlStyleMap innerStyle = HtmlRendererUtil.prepareInnerStyle(component);
+  private void encodeBox(FacesContext facesContext, TobagoResponseWriter writer, UIBox box) throws IOException {
 
-    renderBoxHeader(facesContext, writer, component);
+    // shadow begin
+    {
+      writer.startElement(HtmlConstants.DIV, box);
 
+      StyleClasses classes = new StyleClasses();
+      classes.addClass("box", "shadow");
+      // XXX should this be done everywhere?
+//      classes.addMarkupClass((SupportsMarkup) box, "box", "shadow");
+      writer.writeClassAttribute(classes);
 
-    writer.startElement(HtmlConstants.DIV, component);
-    StyleClasses contentClasses = new StyleClasses();
-    contentClasses.addClass("box", "content");
-    if (component instanceof SupportsMarkup) {
-      contentClasses.addMarkupClass((SupportsMarkup) component, "box", "content");
+      HtmlStyleMap shadow = new HtmlStyleMap();
+      shadow.put("width", box.getWidth().substractNotNegative(new PixelMeasure(1)));
+      shadow.put("height", box.getHeight().substractNotNegative(new PixelMeasure(1)));
+      writer.writeStyleAttribute(shadow);
     }
-    writer.writeClassAttribute(contentClasses);
 
-    writer.startElement(HtmlConstants.DIV, component);
-    String id = component.getClientId(facesContext) + CONTENT_INNER; 
-    writer.writeIdAttribute(id);
-    StyleClasses contentInnerClasses = new StyleClasses();
-    contentInnerClasses.addClass("box", "content-inner");
-    contentInnerClasses.addFullQualifiedClass("dojoDndItem");
-    if (component instanceof SupportsMarkup) {
-      contentInnerClasses.addMarkupClass((SupportsMarkup) component, "box", "content-inner");
+    // border begin
+    {
+      writer.startElement(HtmlConstants.DIV, box);
+
+      StyleClasses classes = new StyleClasses();
+      classes.addClass("box", "border");
+      writer.writeClassAttribute(classes);
+      // XXX should this be done everywhere?
+//      classes.addMarkupClass((SupportsMarkup) box, "box", "border");
+
+      HtmlStyleMap border = new HtmlStyleMap();
+      border.put("width", box.getWidth().substractNotNegative(new PixelMeasure(3)));
+      border.put("height", box.getHeight().substractNotNegative(new PixelMeasure(3)));
+      writer.writeStyleAttribute(border);
     }
-    writer.writeClassAttribute(contentInnerClasses);
-    writer.writeStyleAttribute(innerStyle);
-  }
 
+    renderBoxHeader(facesContext, writer, box);
+
+    // border end
+    writer.endElement(HtmlConstants.DIV);
+    // shadow end
+    writer.endElement(HtmlConstants.DIV);
+  }
 
-  protected void renderBoxHeader(FacesContext facesContext,
-      TobagoResponseWriter writer, UIComponent component) throws IOException {
+  protected void renderBoxHeader(
+      FacesContext facesContext, TobagoResponseWriter writer, UIBox box) throws IOException {
 
-    writer.startElement(HtmlConstants.DIV, component);
+    writer.startElement(HtmlConstants.DIV, box);
     StyleClasses headerClasses = new StyleClasses();
     headerClasses.addClass("box", "header");
-    if (component instanceof SupportsMarkup) {
-      headerClasses.addMarkupClass((SupportsMarkup) component, "box", "header");
-    }
+    // XXX should this be done everywhere?
+    headerClasses.addMarkupClass(box, "box", "header");
     writer.writeClassAttribute(headerClasses);
-    String id = component.getClientId(facesContext) + HEADER;
+    String id = box.getClientId(facesContext) + HEADER;
     writer.writeIdAttribute(id);
-    UIComponent label = component.getFacet(Facets.LABEL);
+    UIComponent label = box.getFacet(Facets.LABEL);
     writer.startElement(HtmlConstants.SPAN, null);
     writer.writeClassAttribute("tobago-box-header-label");
-    String labelString
-        = (String) component.getAttributes().get(Attributes.LABEL);
+    String labelString = (String) box.getAttributes().get(Attributes.LABEL);
     if (label != null) {
       RenderUtil.encode(facesContext, label);
     } else if (labelString != null) {
@@ -138,7 +153,7 @@
     }
     writer.endElement(HtmlConstants.SPAN);
 
-    UIPanel toolbar = (UIPanel) component.getFacet(Facets.TOOL_BAR);
+    UIPanel toolbar = (UIPanel) box.getFacet(Facets.TOOL_BAR);
     if (toolbar != null) {
       renderToolbar(facesContext, writer, toolbar);
     }
@@ -146,15 +161,8 @@
   }
 
   @Override
-  public void encodeEnd(FacesContext facesContext,
-      UIComponent component) throws IOException {
+  public void encodeEnd(FacesContext facesContext, UIComponent component) throws IOException {
     TobagoResponseWriter writer = HtmlRendererUtil.getTobagoResponseWriter(facesContext);
-    encodeEndInner(writer);
-    writer.endElement(HtmlConstants.DIV);
-  }
-
-  private void encodeEndInner(TobagoResponseWriter writer) throws IOException {
-    writer.endElement(HtmlConstants.DIV);
     writer.endElement(HtmlConstants.DIV);
   }
 
@@ -167,7 +175,7 @@
     }
     writer.startElement(HtmlConstants.DIV, null);
     writer.writeClassAttribute(className);
-    toolbar.setRendererType("BoxToolBar");    
+    toolbar.setRendererType("BoxToolBar");
     RenderUtil.encode(facesContext, toolbar);
     writer.endElement(HtmlConstants.DIV);
   }
@@ -176,9 +184,8 @@
     AjaxUtils.checkParamValidity(facesContext, component, UIPanel.class);
     TobagoResponseWriter writer = HtmlRendererUtil.getTobagoResponseWriter(facesContext);
 
-    encodeBeginInner(facesContext, writer, component);
+    encodeBox(facesContext, writer, (UIBox) component);
     component.encodeChildren(facesContext);
-    encodeEndInner(writer);
     facesContext.responseComplete();
   }
 }

Modified: myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/mozilla/style/style.css
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/mozilla/style/style.css?rev=799297&r1=799296&r2=799297&view=diff
==============================================================================
--- myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/mozilla/style/style.css (original)
+++ myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/mozilla/style/style.css Thu Jul 30 14:51:05 2009
@@ -31,13 +31,6 @@
   border-bottom: 0px solid transparent;
 }
 
-/* textArea ---------------------------------------------------------------- */
-
-.tobago-textArea-default  {
-  margin-top: 0px;
-  margin-bottom: 0px;
-}
-
 /* in ---------------------------------------------------------------------- */
 .tobago-in-default  {
   margin-top: 0px;

Modified: myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/msie/style/style.css
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/msie/style/style.css?rev=799297&r1=799296&r2=799297&view=diff
==============================================================================
--- myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/msie/style/style.css (original)
+++ myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/msie/style/style.css Thu Jul 30 14:51:05 2009
@@ -15,19 +15,10 @@
  * limitations under the License.
  */
 
-.tobago-box-default {
-  padding-bottom: 0px;
-}
-
 label.tobago-label-default  {
   margin-top: 2px;
 }
 
-/* this div is expanding by content
-   content is div with css-class tobago-box-content-inner*/
-.tobago-box-content {
-  height: 0px;
-}
 
 .tobago-box-header-toolbar-div {
   top: -1px;

Modified: myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/property/tobago-theme-config.properties
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/property/tobago-theme-config.properties?rev=799297&r1=799296&r2=799297&view=diff
==============================================================================
--- myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/property/tobago-theme-config.properties (original)
+++ myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/property/tobago-theme-config.properties Thu Jul 30 14:51:05 2009
@@ -15,6 +15,11 @@
 # limitations under the License.
 #
 
+Tobago.labelWidth=120
+Tobago.labelSpace=5
+Tobago.fixedHeight=20
+Tobago.CalendarPopupHeight=260
+
 Box.headerHeight=20
 # paddingHeight = (padding + border) * 2
 Box.paddingHeight=12
@@ -24,12 +29,22 @@
 
 #new layout manager
 Box.leftOffset=6
-Box.topOffset=25
+Box.topOffset=26
 Box.rightOffset=7
 Box.bottomOffset=7
 
 DatePicker.fixedWidth=20
 
+In.css.border-left-width=1
+In.css.border-top-width=1
+In.css.border-right-width=1
+In.css.border-bottom-width=1
+
+In.css.padding-left=2
+In.css.padding-top=0
+In.css.padding-right=0
+In.css.padding-bottom=0
+
 MenuBar.fixedHeight=17
 
 Label.fixedWidth=120
@@ -37,10 +52,13 @@
 Popup.paddingWidth=0
 Popup.paddingHeight=0
 
-Tobago.labelWidth=120
-Tobago.labelSpace=5
-Tobago.fixedHeight=20
-Tobago.CalendarPopupHeight=260
+Sheet.ascendingMarkerWidth=15
+Sheet.headerHeight=20
+Sheet.footerHeight=15
+Sheet.rowPadding=3
+Sheet.contentBorder=2
+Sheet.selectorMenuWidth=16
+Sheet.cellPaddingWidth=4
 
 TabGroup.paddingHeight=22
 TabGroup.paddingWidth=23
@@ -51,14 +69,15 @@
 Tab.paddingWidth=0
 Tab.paddingHeight=0
 
-Sheet.ascendingMarkerWidth=15
-Sheet.headerHeight=20
-Sheet.footerHeight=15
-Sheet.rowPadding=3
-Sheet.contentBorder=2
-Sheet.selectorMenuWidth=16
-Sheet.cellPaddingWidth=4
-
+TextArea.css.border-left-width=1
+TextArea.css.border-top-width=1
+TextArea.css.border-right-width=1
+TextArea.css.border-bottom-width=1
+
+TextArea.css.padding-left=2
+TextArea.css.padding-top=0
+TextArea.css.padding-right=0
+TextArea.css.padding-bottom=0
 
 ToolBar.small_off_Height=24
 ToolBar.small_bottom_Height=43

Modified: myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/style/style.css
URL: http://svn.apache.org/viewvc/myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/style/style.css?rev=799297&r1=799296&r2=799297&view=diff
==============================================================================
--- myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/style/style.css (original)
+++ myfaces/tobago/trunk/theme/speyside/src/main/resources/org/apache/myfaces/tobago/renderkit/html/speyside/standard/style/style.css Thu Jul 30 14:51:05 2009
@@ -345,42 +345,42 @@
 
 /* box ----------------------------------------------------------------- */
 
-div.tobago-box-default {
-  overflow: visible;
+.tobago-box-default {
+  position: absolute;
 }
 
-.tobago-box-default {
+.tobago-box-shadow {
+  background-color: #999999;
+  position: absolute;
+  left: 1px;
+  top: 1px;
+}
+
+.tobago-box-border {
+  border: 1px solid #000000;
+  position: absolute;
   overflow: hidden;
-  margin-top: 1px;
-  background: #999999;
-  border: 0px solid #999999;
-  padding: 0px;
-  padding-bottom: 1px;
-  padding-right: 1px;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box;
+  top: -1px;
+  left: -1px;
+  background-color: #FAFAFA;
 }
 
 .tobago-box-header {
-  top: -1px;
   background: #E8E8E8 url(../image/box-header-bg.gif) repeat-x top;
-  height: 20px;
-  border: 1px solid black;
+  height: 19px;
   border-bottom: 1px dotted black;
   font: bold 12px arial, helvetica, sans-serif;
   color: #660000;
-  padding: 0px;
-  padding-left: 5px;
+  padding: 0px 0px 0px 5px;
   overflow: hidden;
   position: relative;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box;
 }
 
 .tobago-box-header-label {
-  padding-top: 2px;
+  padding-top: 3px;
   padding-bottom: 2px;
   float: left;
+  white-space: nowrap;
 }
 
 .tobago-box-header-toolbar-div {
@@ -394,22 +394,6 @@
   top: -1px;
 }
 
-
-.tobago-box-content {
-  position: relative;
-  top: -1px;
-  border: 1px solid #000000;
-  border-top: 0px solid black;
-  background-color: #FAFAFA;
-  padding: 5px;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box;
-}
-
-.tobago-box-content-inner {
-  overflow: auto;
-}
-
 /* label ------------------------------------------------------------------- */
 
 div.tobago-label-default  {
@@ -512,7 +496,7 @@
   color: #000000;
   overflow: auto;
   border: 1px solid #000000;
-  padding-left: 2px;
+  padding: 0 0 0 2px;
 }
 
 .tobago-textArea-readonly  {