Html and css mobile compatible -


i'm trying make website friend's company , did looks on desktop computers. on phones , tablets looks bad. doing research couldn't find how use fluid layouts or other way. on phones, divs position in weird places , on other phones small or cover whole screen. , have white space on bottom of page(on phones). here link can take look: http://agrofit.hr/ p.s. on croatian don't need read :-))). please can. thanks!!!!

try using percentage measurements instead of pixel measurement's.

for example:

.example {width: 100%} 

rather than:

.example {width: 700px} 

also mentioned above use css media queries.

so example:

@media screen , (max-width: 700px) { img {width: 200px} } 

this says whenever viewing on device screen smaller 700px, image 200px.

hope helps.

[edit] test site on mobile -

1) open webpage want test in chrome.

2) right click , click 'inspect'

3) grey window should appear either @ bottom of browser or right hand side of browser.

4) @ top left corner of new grey window there 2 buttons, click 1 says "toggle device toolbar"

toggle device toolbar icon

you can select different devices , see how appear in each.


Comments

Popular posts from this blog

javascript - Clear button on addentry page doesn't work -

c# - Selenium Authentication Popup preventing driver close or quit -

tensorflow when input_data MNIST_data , zlib.error: Error -3 while decompressing: invalid block type -