Layouting without height and width

chirag-ramachandraiah

Apr 18th, 2019 04:21 PM

I was checking out amazon's main page. Whichever element I inspected did not have any height and width style. And their page was perfectly responsive. How is it possible?

bobbyiliev

Dec 24th, 2022 11:23 PM

Hi there,

It's possible that Amazon is using responsive design techniques to create a layout that adjusts to the size of the screen it's being viewed on. Responsive design involves using a mix of flexible grids, layouts, and images, as well as using media queries in CSS to apply different styles depending on the screen size. This allows a website to automatically adjust its layout to look good on different devices, regardless of the dimensions of their screens.

One way to achieve a responsive layout without explicitly setting the height and width of elements is to use percentages for these dimensions. For example, instead of setting a fixed width of 500 pixels for an element, you could set its width to be 50% of the parent element's width. This would cause the element to take up half the width of its parent on any device, regardless of the actual pixel dimensions of the parent element or the device's screen.

It's also possible that Amazon is using some other techniques, such as using flexbox or grid layout, to create a responsive layout without explicitly setting the height and width of elements.