• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 429
  • Last Modified:

Responsive Design in shopify

Hi,

we are creating a shop using the default "launchpad" theme in shopify. We  have add a page item on the front page and used html to create two side by side divs.

Works great on a full screen but the responsive nature for that item doesn't work on an iphone.....

Our Question - what can we do to resolve this. site: http://www-helpinghandz-com.myshopify.com/

Additionally ( and if it should be another question let me know) We would like to move the social networking icons to the top bar by the cart icon. we know where the css is just not quite sure how to do it.

Thanks,
0
sio2y
Asked:
sio2y
  • 2
  • 2
1 Solution
 
Kyle HamiltonData ScientistCommented:
it depends what you want the behavior to be as the window is resized. Do you wan the image and video to scale? Maybe you only want the image to scale?

First and foremost, do not write your styles inline. they belong in a stylesheet.

second, get rid of all the px based dimensions and use % instead. You can use max-width px values to limit thing from growing too large, and min-width to limit how small they get.

At certain screen widths you might want to use media queries. but use them sparingly. it's better to structure your CSS and HTML in such a way as to use less code, and hence less maintenance.
0
 
sio2yAuthor Commented:
Thank You. I'll see what I can do.
0
 
Kyle HamiltonData ScientistCommented:
:)

come back and ask specific questions once you start playing around with it.
0
 
sio2yAuthor Commented:
...and no doubt I'll have a number of them.
0

Featured Post

Upgrade your Question Security!

Add Premium security features to your question to ensure its privacy or anonymity. Learn more about your ability to control Question Security today.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now