html - Problem with CSS for mobile website -

I am creating a mobile website

if you check it on your mobile browser It should fit in such a way that there are no horizontal scrolls. (The content should only be standing vertically). Can a page help me fix css? Just tell me what the right CSS should be so that auto adjust for different mobile phones.

The CSS of this page can be found basically, I think the two main components (body and content).

In addition, I used the mobile website as a sample. Please see its inline CSS by viewing the source of that page.

Thanks

OK, so it seems that your # search div actually My big Firefox browser is also expanding the screen boundaries. In your CSS, you have declared it as:

  #content {width: 100%; Margin: 0; Padding: 20px; Background: white; -image-radius: 10px; -WebKit-boundary-radius: 10px; }  

I have confirmed the CSS by editing the CSS locally, that your padding is actually pushing the limitations of 100% width boundaries, but the good news is that since This is a block level element that fills all the rooms available for it "width: 100%;" Try to get rid of it and see that it works for you. It will still show the same, but without those scroll bars.

Then something like this:

  #content {padding: 20px; Background: white; -image-radius: 10px; -WebKit-boundary-radius: 10px; }