html - Mobile Contact Form -
i'm struggling bit contact form on site: http://www.sandhtestsite.kaylynnehatch.com/contact-us.html
i'm trying work mobile (the rest of site scales down using @mobile screen tags in css).
the form stacked fields don't need float or anything, have container , textarea shrink down better fit mobile screens.
i've tried using @mobile screen #contactus elements in css doesn't seem work. suggestions?
there several issues dealing with. let's step through them 1 one:
- the contact form loaded
iframe
, complicates things unnecessarily. - the
textarea
hascols="50"
set, extending width off side of mobile screen. fieldset
setwidth
of320px
, in addition rule:padding: 20px
. followingcss
, fieldset360px
wide.
#contactus fieldset { width: 320px; padding: 20px; /* width (320px + (20px*2)) == 360px */ }
in addition, may find developer tools such firebug or chrome / safari developer tools indispensable times this. these, can , highlight elements overflowing screen, changing css realtime, while watch design. real timesaver.
concerning cols
on textarea element, question might of benefit well: sizing textarea css vs cols , rows
Comments
Post a Comment