# Building Resizeable Components with Relative CSS Units

DevFeed: [Building Resizeable Components with Relative CSS Units](<https://devfeed.tech/articles/building-resizeable-components-with-relative-css-units-45258.md>)

Original publisher: [Read original article](<https://ishadeed.com/article/building-resizeable-components-relative-css-units/>)

Author: Ahmad Shadeed

Published: 2016-09-09T00:00:00Z

Content type: tutorial

Language: en

Sources: [Ahmad Shadeed](<https://devfeed.tech/sources/ahmad-shadeed.md>)

Topics: [CSS](<https://devfeed.tech/topics/css.md>), [Front end](<https://devfeed.tech/topics/frontend.md>), [User Interfaces](<https://devfeed.tech/topics/user-interfaces.md>), [Web Development](<https://devfeed.tech/topics/web-development.md>)

Tags: [components](<https://devfeed.tech/tags/components.md>), [css](<https://devfeed.tech/tags/css.md>), [developers](<https://devfeed.tech/tags/developers.md>), [examples](<https://devfeed.tech/tags/examples.md>), [front-end](<https://devfeed.tech/tags/front-end.md>), [layouts](<https://devfeed.tech/tags/layouts.md>), [practical](<https://devfeed.tech/tags/practical.md>), [size](<https://devfeed.tech/tags/size.md>), [ui](<https://devfeed.tech/tags/ui.md>), [units](<https://devfeed.tech/tags/units.md>), [web](<https://devfeed.tech/tags/web.md>)

## AI overview

A front-end tutorial on resizing entire UI components with CSS relative units such as percentages, em, and rem.

## Source excerpt

We are living in a dynamic world, everything we do could be changed at anytime. We, as Front-End Developers should build our layouts in a dynamic approach. In this article, we will explore a concept that lets us resize our components by using CSS relative units (%, em, or rem). Not just the type size, but all the UI in that component. We'll look at practical examples, pros and cons of the approach, and even a complete web page built out in this manner.