diff --git a/common/src/app/common/types/shape.cljc b/common/src/app/common/types/shape.cljc
index 352a49f9a..9c5202a77 100644
--- a/common/src/app/common/types/shape.cljc
+++ b/common/src/app/common/types/shape.cljc
@@ -437,4 +437,3 @@
         (make-minimal-group uuid/zero geom-props (:name attrs)))
       (setup-shape geom-props)
       (merge attrs)))
-
diff --git a/frontend/src/app/util/code_gen/markup_html.cljs b/frontend/src/app/util/code_gen/markup_html.cljs
index 2605d31d3..db7f27d4b 100644
--- a/frontend/src/app/util/code_gen/markup_html.cljs
+++ b/frontend/src/app/util/code_gen/markup_html.cljs
@@ -50,49 +50,51 @@
 
   ([objects shape level]
    (let [indent (str/repeat "  " level)
-         maybe-reverse (if (ctl/any-layout? shape) reverse identity)]
+         maybe-reverse (if (ctl/any-layout? shape) reverse identity)
 
-     (cond
-       (svg-markup? shape)
-       (let [svg-markup (generate-svg objects shape)]
-         (dm/fmt "%<div class=\"%\">\n%\n%</div>"
-                 indent
-                 (cgc/shape->selector shape)
-                 svg-markup
-                 indent))
+         shape-html
+         (cond
+           (svg-markup? shape)
+           (let [svg-markup (generate-svg objects shape)]
+             (dm/fmt "%<div class=\"%\">\n%\n%</div>"
+                     indent
+                     (cgc/shape->selector shape)
+                     svg-markup
+                     indent))
 
-       (cph/text-shape? shape)
-       (let [text-shape-html (rds/renderToStaticMarkup (mf/element text/text-shape #js {:shape shape :code? true}))]
-         (dm/fmt "%<div class=\"%\">\n%\n%</div>"
-                 indent
-                 (cgc/shape->selector shape)
-                 text-shape-html
-                 indent))
+           (cph/text-shape? shape)
+           (let [text-shape-html (rds/renderToStaticMarkup (mf/element text/text-shape #js {:shape shape :code? true}))]
+             (dm/fmt "%<div class=\"%\">\n%\n%</div>"
+                     indent
+                     (cgc/shape->selector shape)
+                     text-shape-html
+                     indent))
 
-       (cph/image-shape? shape)
-       (let [data (or (:metadata shape) (:fill-image shape))
-             image-url (cfg/resolve-file-media data)]
-         (dm/fmt "%<img src=\"%\" class=\"%\">\n%</img>"
-                 indent
-                 image-url
-                 (cgc/shape->selector shape)
-                 indent))
+           (cph/image-shape? shape)
+           (let [data (or (:metadata shape) (:fill-image shape))
+                 image-url (cfg/resolve-file-media data)]
+             (dm/fmt "%<img src=\"%\" class=\"%\">\n%</img>"
+                     indent
+                     image-url
+                     (cgc/shape->selector shape)
+                     indent))
 
-       (empty? (:shapes shape))
-       (dm/fmt "%<div class=\"%\">\n%</div>"
-               indent
-               (cgc/shape->selector shape)
-               indent)
+           (empty? (:shapes shape))
+           (dm/fmt "%<div class=\"%\">\n%</div>"
+                   indent
+                   (cgc/shape->selector shape)
+                   indent)
 
-       :else
-       (dm/fmt "%<div class=\"%\">\n%\n%</div>"
-               indent
-               (cgc/shape->selector shape)
-               (->> (:shapes shape)
-                    (maybe-reverse)
-                    (map #(generate-html objects (get objects %) (inc level)))
-                    (str/join "\n"))
-               indent)))))
+           :else
+           (dm/fmt "%<div class=\"%\">\n%\n%</div>"
+                   indent
+                   (cgc/shape->selector shape)
+                   (->> (:shapes shape)
+                        (maybe-reverse)
+                        (map #(generate-html objects (get objects %) (inc level)))
+                        (str/join "\n"))
+                   indent))]
+     (dm/fmt "%<!-- % -->\n%" indent (dm/str (d/name (:type shape)) ": " (:name shape)) shape-html))))
 
 (defn generate-markup
   [objects shapes]
diff --git a/frontend/src/app/util/code_gen/style_css.cljs b/frontend/src/app/util/code_gen/style_css.cljs
index 1b9fa1cf1..18dab1a59 100644
--- a/frontend/src/app/util/code_gen/style_css.cljs
+++ b/frontend/src/app/util/code_gen/style_css.cljs
@@ -22,10 +22,10 @@
 (def prelude "
 html, body {
   background-color: #E8E9EA;
-  height: 100%;
   margin: 0;
+  min-height: 100%;
+  min-width: 100%;
   padding: 0;
-  width: 100%;
 }
 
 body {
@@ -33,6 +33,7 @@ body {
   flex-direction: column;
   align-items: center;
   padding: 2rem;
+  gap: 2rem;
 }
 
 svg {
diff --git a/frontend/src/app/util/code_gen/style_css_values.cljs b/frontend/src/app/util/code_gen/style_css_values.cljs
index 003741492..edfc9b1c4 100644
--- a/frontend/src/app/util/code_gen/style_css_values.cljs
+++ b/frontend/src/app/util/code_gen/style_css_values.cljs
@@ -26,10 +26,11 @@
 (defmethod get-value :position
   [_ shape objects]
   (cond
-    (and (ctl/any-layout-immediate-child? objects shape)
-         (not (ctl/layout-absolute? shape))
-         (or (cph/group-shape? shape)
-             (cph/frame-shape? shape)))
+    (or (and (ctl/any-layout-immediate-child? objects shape)
+             (not (ctl/layout-absolute? shape))
+             (or (cph/group-shape? shape)
+                 (cph/frame-shape? shape)))
+        (cph/root-frame? shape))
     :relative
 
     (and (ctl/any-layout-immediate-child? objects shape)
@@ -83,7 +84,7 @@
                  (:layout-item-v-sizing shape))]
     (cond
       (or (and (ctl/any-layout? shape) (= sizing :auto))
-          (and (ctl/any-layout-immediate-child? shape objects) (= sizing :fill)))
+          (and (ctl/any-layout-immediate-child? objects shape) (= sizing :fill)))
       sizing
 
       (some? (:selrect shape))
@@ -102,20 +103,21 @@
 
 (defmethod get-value :transform
   [_ shape objects]
-  (let [parent (get objects (:parent-id shape))
+  (when-not (svg-markup? shape)
+    (let [parent (get objects (:parent-id shape))
 
-        transform
-        (gmt/multiply (:transform shape (gmt/matrix))
-                      (:transform-inverse parent (gmt/matrix)))]
-    (when-not (gmt/unit? transform)
-      transform)))
+          transform
+          (gmt/multiply (:transform shape (gmt/matrix))
+                        (:transform-inverse parent (gmt/matrix)))]
+      (when-not (gmt/unit? transform)
+        transform))))
 
 (defmethod get-value :background
   [_ {:keys [fills] :as shape} _]
   (let [single-fill? (= (count fills) 1)
         ffill (first fills)
         gradient? (some? (:fill-color-gradient ffill))]
-    (when (and (not (svg-markup? shape)) single-fill? gradient?)
+    (when (and (not (svg-markup? shape)) (not (cph/group-shape? shape)) single-fill? gradient?)
       (fill->color ffill))))
 
 (defmethod get-value :background-color
@@ -123,12 +125,12 @@
   (let [single-fill? (= (count fills) 1)
         ffill (first fills)
         gradient? (some? (:fill-color-gradient ffill))]
-    (when (and (not (svg-markup? shape)) single-fill? (not gradient?))
+    (when (and (not (svg-markup? shape)) (not (cph/group-shape? shape)) single-fill? (not gradient?))
       (fill->color ffill))))
 
 (defmethod get-value :background-image
   [_ {:keys [fills] :as shape} _]
-  (when (and (not (svg-markup? shape)) (> (count fills) 1))
+  (when (and (not (svg-markup? shape)) (not (cph/group-shape? shape)) (> (count fills) 1))
     (->> fills
          (map fill->color))))