사용자:Mineral/연습장2(비교)

보기 RAW Blame 되돌리기 비교

 r16 vs r17
 {{{#!style
+.custom-container {
+    display: inline-block;
+    margin: 1px auto;
+    padding: 5px 10px;
+    border: 1.5px solid #ced4da;
+    border-radius: 10px;
+    background-color: transparent;
+    color: #000;
+    text-align: center;
+    box-sizing: border-box;
+    vertical-align: middle;
+}
+}}}{{{#!style
 .normal-line {
     display: inline-block;
     width: 10px;
     height: 1.5px;
-    min-height: 1px;
     background-color: #ced4da;
     vertical-align: middle;
-    font-size: 1px;
-    line-height: 1px;
     margin: -5px 0 0;
 }
 }}}{{{#!style
 ...
     margin: -2px 0 0 15px;
 }
 }}}{{{#!style
-.custom-container {
+.tree-branch {
+    display: inline-table;
+    vertical-align: top;
+}
+}}}{{{#!style
+.tree-sub {
+    display: inline-table;
+    vertical-align: top;
+    margin-left: 34px;
+    margin-top: -10px;
+}
+}}}{{{#!style
+.tree-leaf {
     display: inline-block;
-    margin: 1px auto;
-    padding: 5px 10px;
-    border: 1.5px solid #ced4da;
-    border-radius: 10px;
-    background-color: transparent;
-    color: #000;
-    text-align: center;
-    box-sizing: border-box;
+    margin-left: 30px;
+    margin-top: -10px;
 }
-}}}style과 본문 구분을 위한 텍스트입니다.
+}}}
 {{{#!wiki class="custom-container"
 텍스트1.
 }}}{{{#!wiki class="normal-line"
-}}}{{{#!wiki style="display: inline-table; vertical-align: top;"
+}}}{{{#!wiki class="tree-branch"
 {{{#!wiki class="custom-container"
 텍스트2.
 }}}
 {{{#!wiki class="bent-line"
-}}}{{{#!wiki style="display: inline-table; vertical-align: top; margin-left: 34px; margin-top: -10px;"
+}}}{{{#!wiki class="tree-sub"
 {{{#!wiki class="custom-container"
 텍스트3.
 }}}
 {{{#!wiki class="bent-line"
-}}}{{{#!wiki style="display: inline-block; margin-left: 34px; margin-top: -10px;"
+}}}{{{#!wiki class="tree-leaf"
 {{{#!wiki class="custom-container"
 텍스트4.
 }}}{{{#!wiki class="normal-line"
 ...