- This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
Viewing 6 posts - 1 through 6 (of 6 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Hi, I’ve read a lot of article about responsive design but I have problem with measurement, for example they say when devices is tablet css changes like this…, when smart phone like this…, but I can’t undrestand how they measure new width,paddings and margins in variable devices? for example we have 4 div in a row and margin is 2px, how can we realize what’s proper number of div in each row in a smart phone or tablet without loosing readability? and what is new margin?
for example at this link http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries in this code `@media screen and (max-width: 980px) {
#pagewrap {
width: 95%;
}
#content {
width: 60%;
padding: 3% 4%;
}
` why width is 95% not for example 80%? or why padding is 3% 4%?
thanks a lot
why width is 95% not for example 80%? or why padding is 3% 4%?
Because that’s what the designer wanted at that specific screen width.
It’s design specific. When the browser window is at a certain size, those elements need to be a certain width to maintain the overall design.
Your design might, and probably will, require different specific numbers.
those elements need to be a certain width to maintain the overall design
do you mean we need Trail and error to gain proper measures?
but I think there was a calculation way based on basic layout measures.
Not exactly, as I said, it depends on how you want your design to work at certain widths.
There are some ‘standard’ device widths which it is, perhaps, advisable to use a decent starting points.
You can find them in the snippets section here.
Thanks a lot Paulie_D and Taufik