Site is not centered on mobile device. (5 posts)

  1. kittensforgood
    Posted 3 years ago #

    When you view my site, it looks centered on a computer. But when I pull it up on an iphone 4s the layout is pretty wonky. It's not centered, which is the biggest problem right now.

    Any ideas on what I can do?

    I'm using 2012 theme and woocommerce.

    The site is http://easyengrave.com if it helps. Thank you.

  2. paulwpxp
    Font hero
    Posted 3 years ago #

    From the first look, it is caused by fixed width in CSS of this in content area

    .bl {
    	background: url("/images/cssll.jpg") no-repeat scroll 0 100% #83ADAD;
    	width: 26em;

    and this in text widget

    .fb-like span {
    	height: 90px !important;
    	margin-right: -375px;
    	overflow: visible !important;
    	width: 450px !important;

    In responsive design, normally you don't use fixed value in width at all, always use percent, or use fixed pixel width but in a proper media query.

  3. kittensforgood
    Posted 3 years ago #


    Thanks for the reply.

    I actually added the .bl thing after this problem occurred.

    I will investigate the fb-like part though.

    I really appreciate the help.

  4. kittensforgood
    Posted 3 years ago #

    Hmm, when I change to 10,30, 50% then on a desktop computer I don't see the facebook line that says like... why's that?

  5. paulwpxp
    Font hero
    Posted 3 years ago #

    I'm not sure why would you need to put that in there in the first place. I think that the embed has already taken care of all the injected CSS for it.

Topic Closed

This topic has been closed to new replies.

About this Topic