Div width getting smaller in smartphones - renders well in a web browser

Question

I have observed that at times width of divs gets smaller while viewing in smartphones, which renders very well in a webpage.

For example : [Website_URL] If we see that in FF or Chrome, the width of header / footer / slider background, all takes the full width of available screen size. However, the same gets much smaller while I view that in my Samsung Galaxy note.

Any idea here - I must be missing something on setting width in the smartphone.

Thanks for your time.

PS : The site looks good in FF, Chrome, IE and Safari. I still have width issue with my Samsung smartphone.

Answer 1

I solved the problem by adding a min-width to the body element.

After further researching, I found that the problem was related to the width of the largest element of the webpage vis-a-vis the width of the browser. When the browser width was going below the width of the widest elements of the page, those elements where a width was not mentioned, was getting shrinked.

I don't know why this happened, if someone else can give any light on this, it would be warmly welcomed.

Thought to add this in case someone in the future comes across the same problem.