Exact Display of Mobile & Desktop

  • alexchua1985 · Member ·

    Hi there,
    I am relatively new to coding, so was hoping someone could offer me some opinion and advice.

    This is my current site: https://echundredpalmsresidence.com/
    and this is the ideal site i am looking at: http://www.westwoodsresidences.com.sg/

    The issue I am facing is that the alignment of my content does not fully display on mobile and is too fully stretched on my desktop 27″ screen.

    Whereas this was not the case with http://www.westwoodsresidences.com.sg/
    The layout and alignment of the content remain consistent across all devices, just different in scaling/sizing.

    Anyone have any advice or alternative way it could fix it?? It could be some CSS issue or theme issue.

    The blog I need help with is: (visible only to logged in users)

  • thesacredpath · Member ·

    Hi there, http://www.westwoodsresidences.com.sg/ is a fixed width site, which means that it does not adjust for different sized screens or windows. Venture is a responsive designed theme that adjusts for all screen/window sizes. HTML tables can’t really be made to adjust properly for smaller screens as you would typically want to take a four column display down to two columns, and then for very small screens such as on phones, down to a single column so that the content would still be easily readable. With a fixed width site, the mobile device will show everything very tiny and people have to zoom in in order to read things on the site and then swipe around.

    You can try adding the following to the very bottom of your custom CSS and see what you think. 

    #primary {
  width: 1000px;
  margin-left: auto;
  margin-right: auto;
}

    The table code built into this theme looks like it would require quite a bit of rewriting to get things to work on a fixed width site. Some of the tables require scrolling left or right independently of the site.

  • The topic ‘Exact Display of Mobile & Desktop’ is closed to new replies.