ContextQMD
Back to Freecodecamp

Challenge 209: Element Size

curriculum/challenges/english/blocks/daily-coding-challenges-python/698a1a863194f1f4e63f6460.md

latest2.4 KB
Original Source

--description--

Given a window size, the width of an element in viewport width "vw" units, and the height of an element in viewport height "vh" units, determine the size of the element in pixels.

  • The given window size and returned element size are strings in the format "width x height", "1200 x 800" for example.

  • "vw" units are the percent of window width. "50vw" for example, is 50% of the width of the window.

  • "vh" units are the percent of window height. "50vh" for example, is 50% of the height of the window.

--hints--

get_element_size("1200 x 800", "50vw", "50vh") should return "600 x 400".

js
({test: () => { runPython(`
from unittest import TestCase
TestCase().assertEqual(get_element_size("1200 x 800", "50vw", "50vh"), "600 x 400")`)
}})

get_element_size("320 x 480", "25vw", "50vh") should return "80 x 240".

js
({test: () => { runPython(`
from unittest import TestCase
TestCase().assertEqual(get_element_size("320 x 480", "25vw", "50vh"), "80 x 240")`)
}})

get_element_size("1000 x 500", "7vw", "3vh") should return "70 x 15".

js
({test: () => { runPython(`
from unittest import TestCase
TestCase().assertEqual(get_element_size("1000 x 500", "7vw", "3vh"), "70 x 15")`)
}})

get_element_size("1920 x 1080", "95vw", "100vh") should return "1824 x 1080".

js
({test: () => { runPython(`
from unittest import TestCase
TestCase().assertEqual(get_element_size("1920 x 1080", "95vw", "100vh"), "1824 x 1080")`)
}})

get_element_size("1200 x 800", "0vw", "0vh") should return "0 x 0".

js
({test: () => { runPython(`
from unittest import TestCase
TestCase().assertEqual(get_element_size("1200 x 800", "0vw", "0vh"), "0 x 0")`)
}})

get_element_size("1440 x 900", "100vw", "114vh") should return "1440 x 1026".

js
({test: () => { runPython(`
from unittest import TestCase
TestCase().assertEqual(get_element_size("1440 x 900", "100vw", "114vh"), "1440 x 1026")`)
}})

--seed--

--seed-contents--

py
def get_element_size(window_size, element_vw, element_vh):

    return window_size

--solutions--

py
def get_element_size(window_size, element_vw, element_vh):
    window_width, window_height = map(int, window_size.split(" x "))

    vw = int(element_vw.replace("vw", ""))
    vh = int(element_vh.replace("vh", ""))

    width_px = round((vw / 100) * window_width)
    height_px = round((vh / 100) * window_height)

    return f"{width_px} x {height_px}"