{"id":65,"date":"2023-09-20T23:34:00","date_gmt":"2023-09-20T16:34:00","guid":{"rendered":"https:\/\/danaidesign.com\/?p=65"},"modified":"2024-01-09T21:43:59","modified_gmt":"2024-01-09T14:43:59","slug":"absolute-and-relative-css-units","status":"publish","type":"post","link":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/","title":{"rendered":"\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units"},"content":{"rendered":"\n

\u0e43\u0e19\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19 CSS \u0e40\u0e23\u0e32\u0e21\u0e31\u0e01\u0e08\u0e30\u0e40\u0e08\u0e2d\u0e01\u0e31\u0e1a\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e48\u0e32\u0e43\u0e2b\u0e49\u0e01\u0e31\u0e1a Elements \u0e15\u0e48\u0e32\u0e07\u0e46 \u0e2d\u0e22\u0e39\u0e48\u0e40\u0e2a\u0e21\u0e2d\u0e44\u0e21\u0e48\u0e27\u0e48\u0e32\u0e08\u0e30\u0e40\u0e1b\u0e47\u0e19 font-size<\/code>, width<\/code>, border-width<\/code>, padding<\/code> \u0e41\u0e25\u0e30\u0e2d\u0e37\u0e48\u0e19\u0e46 \u0e42\u0e14\u0e22\u0e04\u0e48\u0e32\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e40\u0e2b\u0e25\u0e48\u0e32\u0e19\u0e35\u0e49\u0e08\u0e30\u0e0a\u0e48\u0e27\u0e22\u0e43\u0e2b\u0e49 CSS \u0e40\u0e02\u0e49\u0e32\u0e43\u0e08\u0e27\u0e48\u0e32\u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e43\u0e2b\u0e49 Elements \u0e21\u0e35\u0e02\u0e19\u0e32\u0e14\u0e40\u0e17\u0e48\u0e32\u0e44\u0e2b\u0e23\u0e48\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e15\u0e49\u0e2d\u0e07\u0e41\u0e2a\u0e14\u0e07\u0e1a\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e04\u0e2d\u0e21\u0e1e\u0e34\u0e27\u0e40\u0e15\u0e2d\u0e23\u0e4c \u0e2b\u0e23\u0e37\u0e2d\u0e2d\u0e38\u0e1b\u0e01\u0e23\u0e13\u0e4c\u0e15\u0e48\u0e32\u0e07\u0e46<\/p>\n\n\n\n

\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e02\u0e2d\u0e07 CSS \u0e2b\u0e23\u0e37\u0e2d CSS Units \u0e16\u0e39\u0e01\u0e41\u0e1a\u0e48\u0e07\u0e2d\u0e2d\u0e2d\u0e01\u0e40\u0e1b\u0e47\u0e19 2 \u0e1b\u0e23\u0e30\u0e40\u0e20\u0e17\u0e46 \u0e04\u0e37\u0e2d Absolute length units \u0e41\u0e25\u0e30 Relative length units\u0e15\u0e32\u0e21\u0e19\u0e35\u0e49<\/p>\n\n\n\n

Absolute length units \u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23<\/h2>\n\n\n\n

\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e17\u0e35\u0e48\u0e21\u0e35\u0e04\u0e48\u0e32\u0e04\u0e07\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e21\u0e35\u0e01\u0e32\u0e23\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e41\u0e1b\u0e25\u0e07 \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e1b\u0e23\u0e30\u0e40\u0e20\u0e17\u0e19\u0e35\u0e49\u0e08\u0e30\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e01\u0e31\u0e1a\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e01\u0e31\u0e1a Element \u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e43\u0e2b\u0e49\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14\u0e15\u0e32\u0e21\u0e17\u0e35\u0e48\u0e01\u0e33\u0e2b\u0e19\u0e14 \u0e41\u0e15\u0e48\u0e2b\u0e32\u0e01\u0e40\u0e23\u0e32\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e44\u0e21\u0e48\u0e14\u0e35\u0e01\u0e47\u0e08\u0e30\u0e21\u0e35\u0e1c\u0e25\u0e01\u0e23\u0e30\u0e17\u0e1a\u0e01\u0e31\u0e1a Responsive \u0e43\u0e19\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e02\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e17\u0e35\u0e48\u0e1c\u0e34\u0e14\u0e41\u0e1b\u0e25\u0e01\u0e01\u0e31\u0e1a\u0e1a\u0e32\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d<\/p>\n\n\n\n

px (Pixel)<\/h3>\n\n\n\n

px \u0e40\u0e1b\u0e47\u0e19\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e22\u0e2d\u0e14\u0e19\u0e34\u0e22\u0e21 \u0e41\u0e25\u0e30\u0e1e\u0e1a\u0e40\u0e2b\u0e47\u0e19\u0e44\u0e14\u0e49\u0e1a\u0e48\u0e2d\u0e22\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14\u0e40\u0e19\u0e37\u0e48\u0e2d\u0e07\u0e08\u0e32\u0e01\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e15\u0e32\u0e22\u0e15\u0e31\u0e27 (Absolute) \u0e40\u0e1b\u0e34\u0e14\u0e01\u0e31\u0e1a\u0e2d\u0e38\u0e1b\u0e01\u0e23\u0e13\u0e4c\u0e2d\u0e30\u0e44\u0e23 \u0e02\u0e19\u0e32\u0e14\u0e04\u0e27\u0e32\u0e21\u0e25\u0e30\u0e40\u0e2d\u0e35\u0e22\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e40\u0e17\u0e48\u0e32\u0e44\u0e2b\u0e23\u0e48 \u0e2b\u0e23\u0e37\u0e2d Browser \u0e2d\u0e30\u0e44\u0e23 \u0e01\u0e47\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e31\u0e19\u0e2b\u0e21\u0e14 \u0e41\u0e15\u0e48\u0e02\u0e49\u0e2d\u0e40\u0e2a\u0e35\u0e22 \u0e04\u0e37\u0e2d \u0e1c\u0e39\u0e49\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e08\u0e30\u0e44\u0e21\u0e48\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21 font-size<\/code> \u0e44\u0e14\u0e49\u0e40\u0e25\u0e22 \u0e0b\u0e36\u0e48\u0e07\u0e43\u0e19\u0e1b\u0e31\u0e08\u0e08\u0e38\u0e1a\u0e31\u0e19 Browser \u0e15\u0e48\u0e32\u0e07\u0e46 \u0e08\u0e30\u0e21\u0e32\u0e1e\u0e23\u0e49\u0e2d\u0e21\u0e01\u0e31\u0e1a\u0e1f\u0e31\u0e07\u0e01\u0e4c\u0e0a\u0e31\u0e48\u0e19\u0e17\u0e35\u0e48\u0e1c\u0e39\u0e49\u0e43\u0e0a\u0e49\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e1b\u0e23\u0e31\u0e1a\u0e25\u0e14\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e43\u0e19\u0e01\u0e32\u0e23\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e44\u0e14\u0e49\u0e40\u0e2d\u0e07 \u0e0b\u0e36\u0e48\u0e07\u0e16\u0e49\u0e32\u0e40\u0e23\u0e32\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e41\u0e1a\u0e1a px<\/code> \u0e25\u0e07\u0e44\u0e1b \u0e08\u0e30\u0e2a\u0e48\u0e07\u0e1c\u0e25\u0e43\u0e2b\u0e49\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14\u0e40\u0e17\u0e48\u0e32\u0e40\u0e14\u0e34\u0e21\u0e15\u0e25\u0e2d\u0e14\u0e44\u0e21\u0e48\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e44\u0e1b\u0e15\u0e32\u0e21\u0e02\u0e19\u0e32\u0e14\u0e2a\u0e34\u0e48\u0e07\u0e17\u0e35\u0e48\u0e1c\u0e39\u0e49\u0e43\u0e0a\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14 \u0e14\u0e31\u0e07\u0e19\u0e31\u0e49\u0e19 \u0e08\u0e36\u0e07\u0e44\u0e21\u0e48\u0e41\u0e19\u0e30\u0e19\u0e33\u0e43\u0e2b\u0e49\u0e43\u0e0a\u0e49\u0e23\u0e48\u0e27\u0e21\u0e01\u0e31\u0e1a font-size<\/code> \u0e04\u0e23\u0e31\u0e1a<\/p>\n\n\n\n

\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e2d\u0e37\u0e48\u0e19\u0e46 \u0e43\u0e19\u0e2b\u0e21\u0e27\u0e14\u0e19\u0e35\u0e49<\/h4>\n\n\n\n
    \n
  • mm (\u0e21\u0e34\u0e25\u0e21\u0e34\u0e40\u0e21\u0e15\u0e23)<\/li>\n\n\n\n
  • cm (\u0e40\u0e0b\u0e19\u0e15\u0e34\u0e40\u0e21\u0e15\u0e23): 10mm \u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 1cm<\/li>\n\n\n\n
  • in (\u0e19\u0e34\u0e49\u0e27): 2.54cm \u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 1in<\/li>\n\n\n\n
  • pt (points): 1\/72in \u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 1pt<\/li>\n\n\n\n
  • pc (picas): 12pt \u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 1pc<\/li>\n<\/ul>\n\n\n\n

    Relative length units \u0e04\u0e37\u0e2d\u0e2d\u0e30\u0e44\u0e23<\/h2>\n\n\n\n

    \u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e17\u0e35\u0e48\u0e23\u0e30\u0e1a\u0e38\u0e04\u0e48\u0e32\u0e44\u0e21\u0e48\u0e15\u0e32\u0e22\u0e15\u0e31\u0e27 \u0e04\u0e48\u0e32\u0e02\u0e2d\u0e07\u0e21\u0e31\u0e19\u0e08\u0e30\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e31\u0e21\u0e1e\u0e31\u0e19\u0e18\u0e4c\u0e01\u0e31\u0e1a Property \u0e2d\u0e37\u0e48\u0e19\u0e46 \u0e40\u0e21\u0e37\u0e48\u0e2d Property \u0e21\u0e35\u0e01\u0e32\u0e23\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e41\u0e1b\u0e25\u0e07\u0e1e\u0e27\u0e01\u0e21\u0e31\u0e19\u0e08\u0e30\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e15\u0e32\u0e21\u0e44\u0e1b\u0e14\u0e49\u0e27\u0e22 \u0e42\u0e14\u0e22\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19\u0e01\u0e25\u0e38\u0e48\u0e21\u0e19\u0e35\u0e49\u0e08\u0e30\u0e1b\u0e23\u0e30\u0e01\u0e2d\u0e1a\u0e44\u0e1b\u0e14\u0e49\u0e27\u0e22<\/p>\n\n\n\n

    % (Percent)<\/h3>\n\n\n\n

    % \u0e40\u0e1b\u0e47\u0e19\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e41\u0e1a\u0e1a\u0e44\u0e21\u0e48\u0e15\u0e32\u0e22\u0e15\u0e31\u0e27 (Relative) \u0e02\u0e19\u0e32\u0e14\u0e08\u0e30\u0e02\u0e36\u0e49\u0e19\u0e2d\u0e22\u0e39\u0e48\u0e01\u0e31\u0e1a Parent Element \u0e43\u0e19\u0e02\u0e13\u0e30\u0e19\u0e31\u0e49\u0e19 \u0e22\u0e01\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e40\u0e0a\u0e48\u0e19<\/p>\n\n\n

    <div<\/span> class<\/span>='container'<\/span>><\/span>\n    <div<\/span> class<\/span>='card'<\/span>><\/span>\n        Hello\n    <\/div<\/span>><\/span>\n<\/div<\/span>><\/span><\/code><\/span>Code language:<\/span> HTML, XML<\/span> (<\/span>xml<\/span>)<\/span><\/small><\/pre>\n\n
    .container<\/span> {\n    width<\/span>: 300px<\/span>;\n    border<\/span>: 2px<\/span> solid black;\n    padding<\/span>: 20px<\/span>;\n}\n\n.card<\/span> {\n    width<\/span>: 60%<\/span>;\n    border<\/span>: 2px<\/span> solid red;\n    padding<\/span>: 10px<\/span>;\n}<\/code><\/span>Code language:<\/span> CSS<\/span> (<\/span>css<\/span>)<\/span><\/small><\/pre>\n\n\n
    \u0e1c\u0e25\u0e17\u0e35\u0e48\u0e2d\u0e2d\u0e01\u0e21\u0e32\u0e04\u0e37\u0e2d<\/p>\n\n\n\n
    \"\"<\/figure>\n\n\n\n
    \u0e08\u0e32\u0e01\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19 \u0e08\u0e30\u0e40\u0e2b\u0e47\u0e19\u0e44\u0e14\u0e49\u0e27\u0e48\u0e32 .card<\/code> \u0e21\u0e35\u0e02\u0e19\u0e32\u0e14 60% \u0e2b\u0e23\u0e37\u0e2d 180px (60% \u0e02\u0e2d\u0e07 300) \u0e40\u0e21\u0e37\u0e48\u0e2d\u0e2d\u0e22\u0e39\u0e48\u0e43\u0e19 .container<\/code> \u0e17\u0e35\u0e48\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14 300px \u0e0b\u0e36\u0e48\u0e07\u0e2b\u0e32\u0e01 .container<\/code> \u0e21\u0e35\u0e01\u0e32\u0e23\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e04\u0e48\u0e32\u0e02\u0e32\u0e14\u0e02\u0e2d\u0e07 .card<\/code> \u0e01\u0e47\u0e08\u0e30\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e15\u0e32\u0e21\u0e44\u0e1b\u0e14\u0e49\u0e27\u0e22<\/p>\n\n\n\n
    em<\/h3>\n\n\n\n
    em \u0e40\u0e1b\u0e47\u0e19\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e41\u0e1a\u0e1a\u0e44\u0e21\u0e48\u0e15\u0e32\u0e22\u0e15\u0e31\u0e27 (Relative) \u0e1c\u0e39\u0e49\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e1b\u0e23\u0e31\u0e1a\u0e25\u0e14\u0e02\u0e19\u0e32\u0e14\u0e02\u0e2d\u0e07\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e44\u0e14\u0e49\u0e14\u0e49\u0e27\u0e22\u0e1f\u0e31\u0e07\u0e01\u0e4c\u0e0a\u0e31\u0e48\u0e19\u0e17\u0e35\u0e48\u0e21\u0e35\u0e2d\u0e22\u0e39\u0e48\u0e43\u0e19 Browser \u0e0b\u0e36\u0e48\u0e07\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e41\u0e1a\u0e1a em \u0e19\u0e31\u0e49\u0e19\u0e08\u0e30\u0e04\u0e34\u0e14\u0e08\u0e32\u0e01\u0e04\u0e48\u0e32\u0e40\u0e14\u0e34\u0e21\u0e02\u0e2d\u0e07 Parent Element \u0e17\u0e35\u0e48\u0e43\u0e01\u0e25\u0e49\u0e01\u0e31\u0e1a\u0e21\u0e31\u0e19\u0e21\u0e32\u0e01\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14 \u0e2b\u0e23\u0e37\u0e2d\u0e04\u0e48\u0e32\u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\u0e17\u0e35\u0e48\u0e41\u0e15\u0e48\u0e25\u0e30 Browser \u0e01\u0e33\u0e2b\u0e19\u0e14 \u0e0b\u0e36\u0e48\u0e07\u0e42\u0e14\u0e22\u0e2a\u0e48\u0e27\u0e19\u0e43\u0e2b\u0e0d\u0e48\u0e41\u0e25\u0e49\u0e27 \u0e15\u0e31\u0e27\u0e2d\u0e31\u0e01\u0e29\u0e23\u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\u0e08\u0e30\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 16px \u0e42\u0e14\u0e22 1em \u0e08\u0e30\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 100% \u0e2b\u0e23\u0e37\u0e2d\u0e04\u0e34\u0e14\u0e40\u0e1b\u0e47\u0e19 1 \u0e40\u0e17\u0e48\u0e32 \u0e02\u0e2d\u0e07\u0e04\u0e48\u0e32\u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\u0e19\u0e31\u0e48\u0e19\u0e40\u0e2d\u0e07 \u0e41\u0e15\u0e48\u0e02\u0e49\u0e2d\u0e40\u0e2a\u0e35\u0e22\u0e02\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e48\u0e32\u0e14\u0e49\u0e27\u0e22 em \u0e01\u0e47\u0e04\u0e37\u0e2d \u0e01\u0e32\u0e23\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e31\u0e19\u0e02\u0e2d\u0e07\u0e41\u0e15\u0e48\u0e25\u0e30 Browser \u0e41\u0e25\u0e30\u0e17\u0e35\u0e48\u0e2a\u0e33\u0e04\u0e31\u0e0d em<\/code> \u0e21\u0e35\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e40\u0e1b\u0e47\u0e19 1 \u0e40\u0e17\u0e48\u0e32\u0e02\u0e2d\u0e07 Parent Element \u0e17\u0e35\u0e48\u0e43\u0e01\u0e25\u0e49\u0e01\u0e31\u0e1a\u0e21\u0e31\u0e19\u0e40\u0e2a\u0e21\u0e2d \u0e17\u0e33\u0e43\u0e2b\u0e49\u0e01\u0e32\u0e23\u0e41\u0e01\u0e49\u0e44\u0e02\u0e42\u0e04\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e40\u0e1b\u0e47\u0e19\u0e2d\u0e30\u0e44\u0e23\u0e17\u0e35\u0e48\u0e22\u0e38\u0e48\u0e07\u0e22\u0e32\u0e01\u0e21\u0e32\u0e01\u0e46 \u0e22\u0e01\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e40\u0e0a\u0e48\u0e19<\/p>\n\n\n
    body<\/span> { font-size<\/span>: 62.5%<\/span>; }\n\nh1<\/span> { font-size<\/span>: 2.4em<\/span>; }\n\np<\/span> { font-size<\/span>: 1.4em<\/span>; }<\/code><\/span>Code language:<\/span> CSS<\/span> (<\/span>css<\/span>)<\/span><\/small><\/pre>\n\n\n
    \u0e08\u0e32\u0e01\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19 \u0e40\u0e23\u0e32\u0e21\u0e35\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e48\u0e32 font-size<\/code> \u0e43\u0e19 body<\/code> \u0e43\u0e2b\u0e49\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14 62.5% \u0e2b\u0e23\u0e37\u0e2d 10px (\u0e21\u0e32\u0e08\u0e32\u0e01 0.625 * 16) \u0e0b\u0e36\u0e48\u0e07\u0e2b\u0e32\u0e01\u0e40\u0e23\u0e32\u0e44\u0e21\u0e48\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e08\u0e30\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 16px \u0e0b\u0e36\u0e48\u0e07\u0e01\u0e47\u0e04\u0e37\u0e2d\u0e04\u0e48\u0e32\u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\u0e02\u0e2d\u0e07 Browser \u0e19\u0e31\u0e49\u0e19\u0e40\u0e2d\u0e07 <\/p>\n\n\n\n
    h1<\/code> \u0e17\u0e35\u0e48\u0e21\u0e35 font-size<\/code> \u0e40\u0e1b\u0e47\u0e19 2.4 em \u0e01\u0e47\u0e08\u0e30\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 10 * 2.4 = 24px<\/p>\n\n\n\n
    p<\/code> \u0e17\u0e35\u0e48\u0e21\u0e35 font-size<\/code> \u0e40\u0e1b\u0e47\u0e19 1.4 em \u0e01\u0e47\u0e08\u0e30\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 10 * 1.4 = 14px<\/p>\n\n\n
    body<\/span> { font-size<\/span>: 62.5%<\/span>; }\n\n.container<\/span> { font-size<\/span>:1.6em<\/span>; }\n\n.container<\/span> h1<\/span> { font-size<\/span>:2.4em<\/span>; }\n\n.container<\/span> p<\/span> { font-size<\/span>:1.6em<\/span>; }<\/code><\/span>Code language:<\/span> CSS<\/span> (<\/span>css<\/span>)<\/span><\/small><\/pre>\n\n\n
    \u0e08\u0e32\u0e01\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19 \u0e40\u0e23\u0e32\u0e21\u0e35\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e48\u0e32 font-size<\/code> \u0e43\u0e19 body<\/code> \u0e43\u0e2b\u0e49\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14 62.5% \u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e40\u0e14\u0e34\u0e21 \u0e41\u0e15\u0e48\u0e40\u0e23\u0e32\u0e21\u0e35\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e48\u0e32 font-size<\/code> \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e15\u0e34\u0e21\u0e43\u0e19 .container<\/code> \u0e43\u0e2b\u0e49\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14 1.6em \u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 10 * 1.6 = 16px<\/p>\n\n\n\n
    h1<\/code> \u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e15\u0e31\u0e49\u0e07\u0e43\u0e08\u0e08\u0e30\u0e43\u0e2b\u0e49\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14 24px \u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e40\u0e14\u0e34\u0e21\u0e08\u0e30\u0e16\u0e39\u0e01\u0e41\u0e17\u0e19\u0e04\u0e48\u0e32\u0e40\u0e1b\u0e47\u0e19 38.4px \u0e2b\u0e23\u0e37\u0e2d\u0e01\u0e47\u0e04\u0e37\u0e2d 16 * 2.4 = 38.4 \u0e19\u0e31\u0e49\u0e19\u0e40\u0e2d\u0e07<\/p>\n\n\n\n
    p<\/code> \u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e15\u0e31\u0e49\u0e07\u0e43\u0e08\u0e08\u0e30\u0e43\u0e2b\u0e49\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14 16px \u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e40\u0e14\u0e34\u0e21\u0e08\u0e30\u0e16\u0e39\u0e01\u0e41\u0e17\u0e19\u0e04\u0e48\u0e32\u0e40\u0e1b\u0e47\u0e19 25.6px \u0e2b\u0e23\u0e37\u0e2d\u0e01\u0e47\u0e04\u0e37\u0e2d 16 * 1.6 = 25.6 \u0e19\u0e31\u0e49\u0e19\u0e40\u0e2d\u0e07<\/p>\n\n\n\n
    rem (Root em)<\/h3>\n\n\n\n
    rem (root em) \u0e40\u0e1b\u0e47\u0e19\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e43\u0e2b\u0e21\u0e48\u0e43\u0e19 CSS3 \u0e17\u0e35\u0e48\u0e16\u0e39\u0e01\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e02\u0e36\u0e49\u0e19\u0e21\u0e32\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e41\u0e01\u0e49\u0e44\u0e02\u0e1b\u0e31\u0e0d\u0e2b\u0e32\u0e17\u0e35\u0e48\u0e40\u0e01\u0e34\u0e14\u0e02\u0e36\u0e49\u0e19\u0e08\u0e32\u0e01\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e14\u0e49\u0e27\u0e22 em \u0e42\u0e14\u0e22 rem<\/code> \u0e21\u0e35\u0e04\u0e38\u0e13\u0e2a\u0e21\u0e1a\u0e31\u0e15\u0e34\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e31\u0e1a em<\/code> \u0e41\u0e17\u0e1a\u0e17\u0e38\u0e01\u0e1b\u0e23\u0e30\u0e01\u0e32\u0e23 \u0e41\u0e15\u0e48 rem<\/code> \u0e08\u0e30\u0e40\u0e17\u0e35\u0e22\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e01\u0e31\u0e1a Root Element \u0e0b\u0e36\u0e48\u0e07\u0e01\u0e47\u0e04\u0e37\u0e2d HTML \u0e40\u0e2a\u0e21\u0e2d\u0e04\u0e23\u0e31\u0e1a \u0e08\u0e36\u0e07\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e44\u0e14\u0e49\u0e02\u0e19\u0e32\u0e14\u0e17\u0e35\u0e48\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23\u0e0b\u0e36\u0e48\u0e07\u0e01\u0e47\u0e04\u0e37\u0e2d 1 \u0e40\u0e17\u0e48\u0e32\u0e02\u0e2d\u0e07 Root Element \u0e19\u0e31\u0e49\u0e19\u0e40\u0e2d\u0e07 \u0e40\u0e0a\u0e48\u0e19<\/p>\n\n\n
    html<\/span> { font-size<\/span>: 62.5%<\/span>; }\n\nbody<\/span> { font-size<\/span>: 1.4rem<\/span>; }\n\nh1<\/span> { font-size<\/span>: 2.4rem<\/span>; }<\/code><\/span>Code language:<\/span> CSS<\/span> (<\/span>css<\/span>)<\/span><\/small><\/pre>\n\n\n
    \u0e08\u0e32\u0e01\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19 \u0e40\u0e23\u0e32\u0e21\u0e35\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e48\u0e32 font-size<\/code> \u0e43\u0e19 html \u0e43\u0e2b\u0e49\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14 62.5% \u0e2b\u0e23\u0e37\u0e2d 10px (\u0e21\u0e32\u0e08\u0e32\u0e01 0.625 * 16) \u0e0b\u0e36\u0e48\u0e07\u0e2b\u0e32\u0e01\u0e40\u0e23\u0e32\u0e44\u0e21\u0e48\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e08\u0e30\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 16px \u0e0b\u0e36\u0e48\u0e07\u0e01\u0e47\u0e04\u0e37\u0e2d\u0e04\u0e48\u0e32\u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\u0e02\u0e2d\u0e07 Browser \u0e19\u0e31\u0e49\u0e19\u0e40\u0e2d\u0e07<\/p>\n\n\n\n
    body<\/code> \u0e17\u0e35\u0e48\u0e21\u0e35 font-size<\/code> \u0e40\u0e1b\u0e47\u0e19 1.4rem \u0e01\u0e47\u0e08\u0e30\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 10 * 1.4 = 14px<\/p>\n\n\n\n
    h1<\/code> \u0e17\u0e35\u0e48\u0e21\u0e35 font-size<\/code> \u0e40\u0e1b\u0e47\u0e19 2.4rem \u0e01\u0e47\u0e08\u0e30\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 10 * 2.4 = 24px<\/p>\n\n\n
    html<\/span> { font-size<\/span>: 62.5%<\/span>; }\n\nbody<\/span> { font-size<\/span>: 1.4rem<\/span>; }\n\n.container<\/span> { font-size<\/span>: 1.4rem<\/span>; }\n\n.container<\/span> h1<\/span> { font-size<\/span>: 2.4rem<\/span>; }<\/code><\/span>Code language:<\/span> CSS<\/span> (<\/span>css<\/span>)<\/span><\/small><\/pre>\n\n\n
    \u0e08\u0e32\u0e01\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19 \u0e40\u0e23\u0e32\u0e21\u0e35\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e48\u0e32 font-size<\/code> \u0e43\u0e19 html \u0e43\u0e2b\u0e49\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14 62.5% \u0e41\u0e25\u0e30 body \u0e02\u0e19\u0e32\u0e14 1.4rem \u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e40\u0e14\u0e34\u0e21 \u0e41\u0e15\u0e48\u0e40\u0e23\u0e32\u0e21\u0e35\u0e01\u0e32\u0e23\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e48\u0e32 font-size<\/code> \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e15\u0e34\u0e21\u0e43\u0e19 .container<\/code> \u0e43\u0e2b\u0e49\u0e21\u0e35\u0e02\u0e19\u0e32\u0e14 1.4rem \u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 10 * 1.4 = 14px<\/p>\n\n\n\n
    h1<\/code> \u0e17\u0e35\u0e48\u0e21\u0e35 font-size<\/code> \u0e40\u0e1b\u0e47\u0e19 2.4rem \u0e01\u0e47\u0e08\u0e30\u0e22\u0e31\u0e07\u0e04\u0e07\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 10 * 2.4 = 24px \u0e40\u0e1e\u0e23\u0e32\u0e30\u0e21\u0e31\u0e19\u0e44\u0e14\u0e49\u0e17\u0e33\u0e01\u0e32\u0e23\u0e2d\u0e49\u0e32\u0e07\u0e2d\u0e34\u0e07 Root Element \u0e2b\u0e23\u0e37\u0e2d html \u0e2d\u0e22\u0e39\u0e48\u0e40\u0e2a\u0e21\u0e2d<\/p>\n\n\n\n
    vw, vh<\/h3>\n\n\n\n
    v \u0e2b\u0e23\u0e37\u0e2d viewport \u0e40\u0e1b\u0e47\u0e19\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e17\u0e35\u0e48\u0e08\u0e30\u0e2d\u0e49\u0e32\u0e07\u0e2d\u0e34\u0e07\u0e15\u0e32\u0e21\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e02\u0e2d\u0e07 Browser \u0e43\u0e19\u0e02\u0e13\u0e30\u0e17\u0e35\u0e48\u0e41\u0e2a\u0e14\u0e07 \u0e42\u0e14\u0e22 1vh \u0e08\u0e30\u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 1% \u0e02\u0e2d\u0e07\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e39\u0e07 Browser \u0e40\u0e0a\u0e48\u0e19\u0e40\u0e14\u0e35\u0e22\u0e27\u0e01\u0e31\u0e19 1vw \u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 1% \u0e02\u0e2d\u0e07\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07 Browser \u0e16\u0e49\u0e32\u0e2d\u0e22\u0e32\u0e01\u0e23\u0e39\u0e49\u0e27\u0e48\u0e32\u0e21\u0e31\u0e19\u0e40\u0e1b\u0e47\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23\u0e43\u0e2b\u0e49\u0e25\u0e2d\u0e07\u0e40\u0e02\u0e32\u0e42\u0e04\u0e49\u0e14\u0e14\u0e49\u0e32\u0e19\u0e25\u0e48\u0e32\u0e07\u0e19\u0e35\u0e49\u0e44\u0e1b\u0e43\u0e0a\u0e49 \u0e41\u0e25\u0e30\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e22\u0e32\u0e22\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e14\u0e39\u0e04\u0e23\u0e31\u0e1a<\/p>\n\n\n
    h1<\/span> { font-size<\/span>: 24vw<\/span>; }<\/code><\/span>Code language:<\/span> CSS<\/span> (<\/span>css<\/span>)<\/span><\/small><\/pre>\n\n\n
    \u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e2d\u0e37\u0e48\u0e19\u0e46 \u0e43\u0e19\u0e2b\u0e21\u0e27\u0e14\u0e19\u0e35\u0e49<\/h4>\n\n\n\n
      \n
    • vmin: \u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e31\u0e1a vw, vh \u0e41\u0e15\u0e48\u0e40\u0e25\u0e47\u0e01\u0e01\u0e27\u0e48\u0e32<\/li>\n\n\n\n
    • vmax: \u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e31\u0e1a vw, vh \u0e41\u0e15\u0e48\u0e43\u0e2b\u0e0d\u0e48\u0e01\u0e27\u0e48\u0e32<\/li>\n\n\n\n
    • ex: \u0e2b\u0e19\u0e48\u0e27\u0e22\u0e17\u0e35\u0e48\u0e2d\u0e49\u0e32\u0e07\u0e2d\u0e34\u0e07\u0e08\u0e32\u0e01 x-height \u0e2b\u0e23\u0e37\u0e2d lower case \u0e02\u0e2d\u0e07 font \u0e1b\u0e31\u0e08\u0e08\u0e38\u0e1a\u0e31\u0e19 \u0e2b\u0e23\u0e37\u0e2d \u00bd \u0e02\u0e2d\u0e07 em<\/li>\n\n\n\n
    • ch: \u0e2b\u0e19\u0e48\u0e27\u0e22\u0e17\u0e35\u0e48\u0e2d\u0e49\u0e32\u0e07\u0e2d\u0e34\u0e07\u0e08\u0e32\u0e01\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e15\u0e31\u0e27\u0e2d\u0e31\u0e01\u0e29\u0e23 “0”<\/li>\n<\/ul>\n\n\n\n
      \u0e2a\u0e23\u0e38\u0e1b<\/h2>\n\n\n\n
      \u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e02\u0e2d\u0e07 CSS (CSS Units) \u0e21\u0e35\u0e01\u0e32\u0e23\u0e41\u0e1a\u0e48\u0e07\u0e2d\u0e2d\u0e01\u0e40\u0e1b\u0e47\u0e19 2 \u0e04\u0e37\u0e2d Absolute length units \u0e41\u0e25\u0e30 Relative length units \u0e41\u0e15\u0e48\u0e25\u0e30\u0e1b\u0e23\u0e30\u0e40\u0e20\u0e17\u0e21\u0e35\u0e23\u0e39\u0e1b\u0e41\u0e1a\u0e1a\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e17\u0e35\u0e48\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\u0e02\u0e36\u0e49\u0e19\u0e2d\u0e22\u0e39\u0e48\u0e01\u0e31\u0e1a\u0e2a\u0e16\u0e32\u0e19\u0e01\u0e32\u0e23\u0e13\u0e4c \u0e41\u0e15\u0e48\u0e40\u0e2d\u0e32\u0e08\u0e23\u0e34\u0e07\u0e46 \u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e1a\u0e48\u0e2d\u0e22\u0e46 \u0e01\u0e47\u0e08\u0e30\u0e40\u0e1b\u0e47\u0e19\u0e1e\u0e27\u0e01 px % em \u0e41\u0e25\u0e30 rem \u0e04\u0e23\u0e31\u0e1a \u0e41\u0e15\u0e48\u0e16\u0e49\u0e32\u0e2b\u0e32\u0e01\u0e43\u0e04\u0e23\u0e2d\u0e22\u0e32\u0e01\u0e25\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e41\u0e1a\u0e1a\u0e2d\u0e37\u0e48\u0e19\u0e46 \u0e01\u0e47\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e40\u0e2d\u0e32\u0e44\u0e14\u0e49\u0e40\u0e25\u0e22\u0e15\u0e32\u0e21\u0e04\u0e27\u0e32\u0e21\u0e40\u0e2b\u0e21\u0e32\u0e30\u0e2a\u0e21\u0e40\u0e25\u0e22\u0e04\u0e23\u0e31\u0e1a<\/p>\n","protected":false},"excerpt":{"rendered":"
      \u0e2b\u0e25\u0e32\u0e22\u0e04\u0e19\u0e04\u0e07\u0e08\u0e30\u0e40\u0e04\u0e22\u0e1c\u0e48\u0e32\u0e19\u0e15\u0e32\u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e17\u0e35\u0e48\u0e40\u0e1b\u0e47\u0e19 px, em, rem \u0e41\u0e25\u0e30 vw \u0e01\u0e31\u0e19\u0e21\u0e32\u0e1a\u0e49\u0e32\u0e07 \u0e41\u0e15\u0e48\u0e23\u0e39\u0e49\u0e23\u0e36\u0e1b\u0e48\u0e32\u0e27\u0e27\u0e48\u0e32\u0e1e\u0e27\u0e01\u0e21\u0e31\u0e19\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07 \u0e41\u0e25\u0e30\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e01\u0e31\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23 \u0e27\u0e31\u0e19\u0e19\u0e35\u0e49\u0e40\u0e23\u0e32\u0e08\u0e30\u0e21\u0e32\u0e14\u0e39\u0e01\u0e31\u0e19\u0e04\u0e23\u0e31\u0e1a <\/p>\n","protected":false},"author":1,"featured_media":609,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[3],"tags":[15,16,14],"acf":[],"yoast_head":"\n\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units | DanaiDesign<\/title>\n<meta name=\"description\" content=\"\u0e2b\u0e25\u0e32\u0e22\u0e04\u0e19\u0e04\u0e07\u0e08\u0e30\u0e40\u0e04\u0e22\u0e1c\u0e48\u0e32\u0e19\u0e15\u0e32\u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e17\u0e35\u0e48\u0e40\u0e1b\u0e47\u0e19 px, em, rem \u0e41\u0e25\u0e30 vw \u0e01\u0e31\u0e19\u0e21\u0e32\u0e1a\u0e49\u0e32\u0e07 \u0e41\u0e15\u0e48\u0e23\u0e39\u0e49\u0e23\u0e36\u0e1b\u0e48\u0e32\u0e27\u0e27\u0e48\u0e32\u0e1e\u0e27\u0e01\u0e21\u0e31\u0e19\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07 \u0e41\u0e25\u0e30\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e01\u0e31\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23 \u0e27\u0e31\u0e19\u0e19\u0e35\u0e49\u0e40\u0e23\u0e32\u0e08\u0e30\u0e21\u0e32\u0e14\u0e39\u0e01\u0e31\u0e19\u0e04\u0e23\u0e31\u0e1a\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units | DanaiDesign\" \/>\n<meta property=\"og:description\" content=\"\u0e2b\u0e25\u0e32\u0e22\u0e04\u0e19\u0e04\u0e07\u0e08\u0e30\u0e40\u0e04\u0e22\u0e1c\u0e48\u0e32\u0e19\u0e15\u0e32\u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e17\u0e35\u0e48\u0e40\u0e1b\u0e47\u0e19 px, em, rem \u0e41\u0e25\u0e30 vw \u0e01\u0e31\u0e19\u0e21\u0e32\u0e1a\u0e49\u0e32\u0e07 \u0e41\u0e15\u0e48\u0e23\u0e39\u0e49\u0e23\u0e36\u0e1b\u0e48\u0e32\u0e27\u0e27\u0e48\u0e32\u0e1e\u0e27\u0e01\u0e21\u0e31\u0e19\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07 \u0e41\u0e25\u0e30\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e01\u0e31\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23 \u0e27\u0e31\u0e19\u0e19\u0e35\u0e49\u0e40\u0e23\u0e32\u0e08\u0e30\u0e21\u0e32\u0e14\u0e39\u0e01\u0e31\u0e19\u0e04\u0e23\u0e31\u0e1a\" \/>\n<meta property=\"og:url\" content=\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/\" \/>\n<meta property=\"og:site_name\" content=\"DanaiDesign\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/danaidesignpage\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/danaidesignpage\" \/>\n<meta property=\"article:published_time\" content=\"2023-09-20T16:34:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-01-09T14:43:59+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/danaidesign.com\/wp-content\/uploads\/2023\/09\/absolute-and-relative-css-units.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Danai Phianphutthikorn\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@https:\/\/twitter.com\/danaidesign\" \/>\n<meta name=\"twitter:site\" content=\"@danaidesign\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Danai Phianphutthikorn\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/\"},\"author\":{\"name\":\"Danai Phianphutthikorn\",\"@id\":\"https:\/\/danaidesign.com\/#\/schema\/person\/ce55535f5fd933bb82ed4a4fed3776a4\"},\"headline\":\"\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units\",\"datePublished\":\"2023-09-20T16:34:00+00:00\",\"dateModified\":\"2024-01-09T14:43:59+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/\"},\"wordCount\":145,\"publisher\":{\"@id\":\"https:\/\/danaidesign.com\/#\/schema\/person\/ce55535f5fd933bb82ed4a4fed3776a4\"},\"image\":{\"@id\":\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/danaidesign.com\/wp-content\/uploads\/2023\/09\/absolute-and-relative-css-units.jpg\",\"keywords\":[\"CSS\",\"Front-end\",\"WebDev\"],\"articleSection\":[\"Coding\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/\",\"url\":\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/\",\"name\":\"\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units | DanaiDesign\",\"isPartOf\":{\"@id\":\"https:\/\/danaidesign.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/danaidesign.com\/wp-content\/uploads\/2023\/09\/absolute-and-relative-css-units.jpg\",\"datePublished\":\"2023-09-20T16:34:00+00:00\",\"dateModified\":\"2024-01-09T14:43:59+00:00\",\"description\":\"\u0e2b\u0e25\u0e32\u0e22\u0e04\u0e19\u0e04\u0e07\u0e08\u0e30\u0e40\u0e04\u0e22\u0e1c\u0e48\u0e32\u0e19\u0e15\u0e32\u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e17\u0e35\u0e48\u0e40\u0e1b\u0e47\u0e19 px, em, rem \u0e41\u0e25\u0e30 vw \u0e01\u0e31\u0e19\u0e21\u0e32\u0e1a\u0e49\u0e32\u0e07 \u0e41\u0e15\u0e48\u0e23\u0e39\u0e49\u0e23\u0e36\u0e1b\u0e48\u0e32\u0e27\u0e27\u0e48\u0e32\u0e1e\u0e27\u0e01\u0e21\u0e31\u0e19\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07 \u0e41\u0e25\u0e30\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e01\u0e31\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23 \u0e27\u0e31\u0e19\u0e19\u0e35\u0e49\u0e40\u0e23\u0e32\u0e08\u0e30\u0e21\u0e32\u0e14\u0e39\u0e01\u0e31\u0e19\u0e04\u0e23\u0e31\u0e1a\",\"breadcrumb\":{\"@id\":\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#primaryimage\",\"url\":\"https:\/\/danaidesign.com\/wp-content\/uploads\/2023\/09\/absolute-and-relative-css-units.jpg\",\"contentUrl\":\"https:\/\/danaidesign.com\/wp-content\/uploads\/2023\/09\/absolute-and-relative-css-units.jpg\",\"width\":1200,\"height\":630,\"caption\":\"\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/danaidesign.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Coding\",\"item\":\"https:\/\/danaidesign.com\/topics\/coding\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/danaidesign.com\/#website\",\"url\":\"https:\/\/danaidesign.com\/\",\"name\":\"DanaiDesign\",\"description\":\"\u0e1a\u0e25\u0e47\u0e2d\u0e01\u0e2a\u0e48\u0e27\u0e19\u0e15\u0e31\u0e27\u0e17\u0e35\u0e48\u0e23\u0e27\u0e1a\u0e23\u0e27\u0e21\u0e04\u0e27\u0e32\u0e21\u0e23\u0e39\u0e49 \u0e41\u0e25\u0e30\u0e01\u0e32\u0e23\u0e04\u0e49\u0e19\u0e04\u0e27\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\u0e46\",\"publisher\":{\"@id\":\"https:\/\/danaidesign.com\/#\/schema\/person\/ce55535f5fd933bb82ed4a4fed3776a4\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/danaidesign.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/danaidesign.com\/#\/schema\/person\/ce55535f5fd933bb82ed4a4fed3776a4\",\"name\":\"Danai Phianphutthikorn\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/danaidesign.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/danaidesign.com\/wp-content\/uploads\/2024\/01\/logo-danaidesign.svg\",\"contentUrl\":\"https:\/\/danaidesign.com\/wp-content\/uploads\/2024\/01\/logo-danaidesign.svg\",\"width\":300,\"height\":300,\"caption\":\"Danai Phianphutthikorn\"},\"logo\":{\"@id\":\"https:\/\/danaidesign.com\/#\/schema\/person\/image\/\"},\"description\":\"Founder, Writer, Designer, Videography, YouTuber\",\"sameAs\":[\"https:\/\/www.danaidesign.com\",\"https:\/\/www.facebook.com\/danaidesignpage\",\"https:\/\/x.com\/https:\/\/twitter.com\/danaidesign\",\"https:\/\/www.youtube.com\/@Danaidesign\"],\"url\":\"https:\/\/danaidesign.com\/author\/danai\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units | DanaiDesign","description":"\u0e2b\u0e25\u0e32\u0e22\u0e04\u0e19\u0e04\u0e07\u0e08\u0e30\u0e40\u0e04\u0e22\u0e1c\u0e48\u0e32\u0e19\u0e15\u0e32\u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e17\u0e35\u0e48\u0e40\u0e1b\u0e47\u0e19 px, em, rem \u0e41\u0e25\u0e30 vw \u0e01\u0e31\u0e19\u0e21\u0e32\u0e1a\u0e49\u0e32\u0e07 \u0e41\u0e15\u0e48\u0e23\u0e39\u0e49\u0e23\u0e36\u0e1b\u0e48\u0e32\u0e27\u0e27\u0e48\u0e32\u0e1e\u0e27\u0e01\u0e21\u0e31\u0e19\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07 \u0e41\u0e25\u0e30\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e01\u0e31\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23 \u0e27\u0e31\u0e19\u0e19\u0e35\u0e49\u0e40\u0e23\u0e32\u0e08\u0e30\u0e21\u0e32\u0e14\u0e39\u0e01\u0e31\u0e19\u0e04\u0e23\u0e31\u0e1a","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/","og_locale":"en_US","og_type":"article","og_title":"\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units | DanaiDesign","og_description":"\u0e2b\u0e25\u0e32\u0e22\u0e04\u0e19\u0e04\u0e07\u0e08\u0e30\u0e40\u0e04\u0e22\u0e1c\u0e48\u0e32\u0e19\u0e15\u0e32\u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e17\u0e35\u0e48\u0e40\u0e1b\u0e47\u0e19 px, em, rem \u0e41\u0e25\u0e30 vw \u0e01\u0e31\u0e19\u0e21\u0e32\u0e1a\u0e49\u0e32\u0e07 \u0e41\u0e15\u0e48\u0e23\u0e39\u0e49\u0e23\u0e36\u0e1b\u0e48\u0e32\u0e27\u0e27\u0e48\u0e32\u0e1e\u0e27\u0e01\u0e21\u0e31\u0e19\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07 \u0e41\u0e25\u0e30\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e01\u0e31\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23 \u0e27\u0e31\u0e19\u0e19\u0e35\u0e49\u0e40\u0e23\u0e32\u0e08\u0e30\u0e21\u0e32\u0e14\u0e39\u0e01\u0e31\u0e19\u0e04\u0e23\u0e31\u0e1a","og_url":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/","og_site_name":"DanaiDesign","article_publisher":"https:\/\/www.facebook.com\/danaidesignpage","article_author":"https:\/\/www.facebook.com\/danaidesignpage","article_published_time":"2023-09-20T16:34:00+00:00","article_modified_time":"2024-01-09T14:43:59+00:00","og_image":[{"width":1200,"height":630,"url":"https:\/\/danaidesign.com\/wp-content\/uploads\/2023\/09\/absolute-and-relative-css-units.jpg","type":"image\/jpeg"}],"author":"Danai Phianphutthikorn","twitter_card":"summary_large_image","twitter_creator":"@https:\/\/twitter.com\/danaidesign","twitter_site":"@danaidesign","twitter_misc":{"Written by":"Danai Phianphutthikorn","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#article","isPartOf":{"@id":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/"},"author":{"name":"Danai Phianphutthikorn","@id":"https:\/\/danaidesign.com\/#\/schema\/person\/ce55535f5fd933bb82ed4a4fed3776a4"},"headline":"\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units","datePublished":"2023-09-20T16:34:00+00:00","dateModified":"2024-01-09T14:43:59+00:00","mainEntityOfPage":{"@id":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/"},"wordCount":145,"publisher":{"@id":"https:\/\/danaidesign.com\/#\/schema\/person\/ce55535f5fd933bb82ed4a4fed3776a4"},"image":{"@id":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#primaryimage"},"thumbnailUrl":"https:\/\/danaidesign.com\/wp-content\/uploads\/2023\/09\/absolute-and-relative-css-units.jpg","keywords":["CSS","Front-end","WebDev"],"articleSection":["Coding"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/","url":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/","name":"\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units | DanaiDesign","isPartOf":{"@id":"https:\/\/danaidesign.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#primaryimage"},"image":{"@id":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#primaryimage"},"thumbnailUrl":"https:\/\/danaidesign.com\/wp-content\/uploads\/2023\/09\/absolute-and-relative-css-units.jpg","datePublished":"2023-09-20T16:34:00+00:00","dateModified":"2024-01-09T14:43:59+00:00","description":"\u0e2b\u0e25\u0e32\u0e22\u0e04\u0e19\u0e04\u0e07\u0e08\u0e30\u0e40\u0e04\u0e22\u0e1c\u0e48\u0e32\u0e19\u0e15\u0e32\u0e01\u0e31\u0e1a\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e17\u0e35\u0e48\u0e40\u0e1b\u0e47\u0e19 px, em, rem \u0e41\u0e25\u0e30 vw \u0e01\u0e31\u0e19\u0e21\u0e32\u0e1a\u0e49\u0e32\u0e07 \u0e41\u0e15\u0e48\u0e23\u0e39\u0e49\u0e23\u0e36\u0e1b\u0e48\u0e32\u0e27\u0e27\u0e48\u0e32\u0e1e\u0e27\u0e01\u0e21\u0e31\u0e19\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07 \u0e41\u0e25\u0e30\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e01\u0e31\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23 \u0e27\u0e31\u0e19\u0e19\u0e35\u0e49\u0e40\u0e23\u0e32\u0e08\u0e30\u0e21\u0e32\u0e14\u0e39\u0e01\u0e31\u0e19\u0e04\u0e23\u0e31\u0e1a","breadcrumb":{"@id":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/danaidesign.com\/absolute-and-relative-css-units\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#primaryimage","url":"https:\/\/danaidesign.com\/wp-content\/uploads\/2023\/09\/absolute-and-relative-css-units.jpg","contentUrl":"https:\/\/danaidesign.com\/wp-content\/uploads\/2023\/09\/absolute-and-relative-css-units.jpg","width":1200,"height":630,"caption":"\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units"},{"@type":"BreadcrumbList","@id":"https:\/\/danaidesign.com\/absolute-and-relative-css-units\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/danaidesign.com\/"},{"@type":"ListItem","position":2,"name":"Coding","item":"https:\/\/danaidesign.com\/topics\/coding\/"},{"@type":"ListItem","position":3,"name":"\u0e04\u0e27\u0e32\u0e21\u0e41\u0e15\u0e01\u0e15\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e48\u0e27\u0e22\u0e27\u0e31\u0e14\u0e43\u0e19 CSS Units"}]},{"@type":"WebSite","@id":"https:\/\/danaidesign.com\/#website","url":"https:\/\/danaidesign.com\/","name":"DanaiDesign","description":"\u0e1a\u0e25\u0e47\u0e2d\u0e01\u0e2a\u0e48\u0e27\u0e19\u0e15\u0e31\u0e27\u0e17\u0e35\u0e48\u0e23\u0e27\u0e1a\u0e23\u0e27\u0e21\u0e04\u0e27\u0e32\u0e21\u0e23\u0e39\u0e49 \u0e41\u0e25\u0e30\u0e01\u0e32\u0e23\u0e04\u0e49\u0e19\u0e04\u0e27\u0e49\u0e32\u0e15\u0e48\u0e32\u0e07\u0e46","publisher":{"@id":"https:\/\/danaidesign.com\/#\/schema\/person\/ce55535f5fd933bb82ed4a4fed3776a4"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/danaidesign.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/danaidesign.com\/#\/schema\/person\/ce55535f5fd933bb82ed4a4fed3776a4","name":"Danai Phianphutthikorn","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/danaidesign.com\/#\/schema\/person\/image\/","url":"https:\/\/danaidesign.com\/wp-content\/uploads\/2024\/01\/logo-danaidesign.svg","contentUrl":"https:\/\/danaidesign.com\/wp-content\/uploads\/2024\/01\/logo-danaidesign.svg","width":300,"height":300,"caption":"Danai Phianphutthikorn"},"logo":{"@id":"https:\/\/danaidesign.com\/#\/schema\/person\/image\/"},"description":"Founder, Writer, Designer, Videography, YouTuber","sameAs":["https:\/\/www.danaidesign.com","https:\/\/www.facebook.com\/danaidesignpage","https:\/\/x.com\/https:\/\/twitter.com\/danaidesign","https:\/\/www.youtube.com\/@Danaidesign"],"url":"https:\/\/danaidesign.com\/author\/danai\/"}]}},"_links":{"self":[{"href":"https:\/\/danaidesign.com\/wp-json\/wp\/v2\/posts\/65"}],"collection":[{"href":"https:\/\/danaidesign.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/danaidesign.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/danaidesign.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/danaidesign.com\/wp-json\/wp\/v2\/comments?post=65"}],"version-history":[{"count":9,"href":"https:\/\/danaidesign.com\/wp-json\/wp\/v2\/posts\/65\/revisions"}],"predecessor-version":[{"id":582,"href":"https:\/\/danaidesign.com\/wp-json\/wp\/v2\/posts\/65\/revisions\/582"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/danaidesign.com\/wp-json\/wp\/v2\/media\/609"}],"wp:attachment":[{"href":"https:\/\/danaidesign.com\/wp-json\/wp\/v2\/media?parent=65"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/danaidesign.com\/wp-json\/wp\/v2\/categories?post=65"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/danaidesign.com\/wp-json\/wp\/v2\/tags?post=65"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}