Compute percent widths/margins properly and fix numerous small visual…

… layout bugs.

src/components/main/layout/block.rs

@@ -196,15 +196,15 @@ impl BlockFlowData {
                 let available_width = remaining_width - model.noncontent_width();
 
                 // Top and bottom margins for blocks are 0 if auto.
-                let margin_top = MaybeAuto::from_margin(style.margin_top());
-                let margin_top = margin_top.spec_or_default(Au(0));
-                let margin_bottom = MaybeAuto::from_margin(style.margin_bottom());
-                let margin_bottom = margin_bottom.spec_or_default(Au(0));
+                let margin_top = MaybeAuto::from_margin(style.margin_top(),
+                                                        remaining_width).spec_or_default(Au(0));
+                let margin_bottom = MaybeAuto::from_margin(style.margin_bottom(),
+                                                           remaining_width).spec_or_default(Au(0));
 
                 let (width, margin_left, margin_right) =
-                    (MaybeAuto::from_width(style.width()),
-                     MaybeAuto::from_margin(style.margin_left()),
-                     MaybeAuto::from_margin(style.margin_right()));
+                    (MaybeAuto::from_width(style.width(), remaining_width),
+                     MaybeAuto::from_margin(style.margin_left(), remaining_width),
+                     MaybeAuto::from_margin(style.margin_right(), remaining_width));
 
                 // FIXME(pcwalton): We discard the width here. Is that correct?
                 let (_, margin_left, margin_right) = self.compute_horiz(width,
@@ -218,7 +218,7 @@ impl BlockFlowData {
                 model.margin.left = margin_left;
 
                 x_offset = model.offset();
-                remaining_width = remaining_width - model.noncontent_width();
+                remaining_width = width;
             }
 
             do box.with_mut_base |base| {
@@ -243,10 +243,12 @@ impl BlockFlowData {
 
     pub fn assign_height_block(@mut self, ctx: &LayoutContext) {
         let mut cur_y = Au(0);
+        let mut top_offset = Au(0);
 
         for self.box.each |&box| {
             do box.with_model |model| {
-                cur_y += model.margin.top + model.border.top + model.padding.top;
+                top_offset = model.margin.top + model.border.top + model.padding.top;
+                cur_y += top_offset;
             }
         }
 
@@ -260,22 +262,24 @@ impl BlockFlowData {
         let height = if self.is_root {
             Au::max(ctx.screen_size.size.height, cur_y)
         } else {
-            cur_y
+            cur_y - top_offset
         };
-
-        //TODO(eatkinson): compute heights using the 'height' property.
-        self.common.position.size.height = height;
-
+
+        let mut pb = Au(0);
         self.box.map(|&box| {
             do box.with_mut_base |base| {
                 //The associated box is the border box of this flow
                 base.position.origin.y = base.model.margin.top;
 
-                let pb = base.model.padding.top + base.model.padding.bottom +
+                pb = base.model.padding.top + base.model.padding.bottom +
                     base.model.border.top + base.model.border.bottom;
                 base.position.size.height = height + pb;
             }
         });
+
+        //TODO(eatkinson): compute heights using the 'height' property.
+        self.common.position.size.height = height + pb;
+
     }
 
     pub fn build_display_list_block<E:ExtraDisplayListData>(@mut self,

src/components/main/layout/model.rs

@@ -37,24 +37,23 @@ pub enum MaybeAuto {
     Specified(Au),
 }
 
-impl MaybeAuto {
-    pub fn from_margin(margin: CSSMargin) -> MaybeAuto{
+impl MaybeAuto{
+    pub fn from_margin(margin: CSSMargin, cb_width: Au) -> MaybeAuto{
         match margin {
             CSSMarginAuto => Auto,
             //FIXME(eatkinson): Compute percents properly
-            CSSMarginPercentage(_) => Specified(Au(0)),
+            CSSMarginPercentage(percent) => Specified(cb_width.scale_by(percent/100.0)),
             //FIXME(eatkinson): Compute pt and em values properly
             CSSMarginLength(Px(v)) | 
             CSSMarginLength(Pt(v)) | 
             CSSMarginLength(Em(v)) => Specified(Au::from_frac_px(v)),
         }
     }
 
-    pub fn from_width(width: CSSWidth) -> MaybeAuto{
+    pub fn from_width(width: CSSWidth, cb_width: Au) -> MaybeAuto{
         match width{
             CSSWidthAuto => Auto,
-            //FIXME(eatkinson): Compute percents properly
-            CSSWidthPercentage(_) => Specified(Au(0)),
+            CSSWidthPercentage(percent) => Specified(cb_width.scale_by(percent/100.0)),
             //FIXME(eatkinson): Compute pt and em values properly
             CSSWidthLength(Px(v)) | 
             CSSWidthLength(Pt(v)) | 
@@ -165,12 +164,12 @@ impl RenderBox {
             let border_width = border.top;
             let bounds = Rect {
                 origin: Point2D {
-                    x: abs_bounds.origin.x,
-                    y: abs_bounds.origin.y,
+                    x: abs_bounds.origin.x + border_width.scale_by(0.5),
+                    y: abs_bounds.origin.y + border_width.scale_by(0.5),
                 },
                 size: Size2D {
-                    width: abs_bounds.size.width,
-                    height: abs_bounds.size.height
+                    width: abs_bounds.size.width - border_width,
+                    height: abs_bounds.size.height - border_width
                 }
             };