Site is not centered on mobile device.

  • 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 https://easyengrave.com if it helps. Thank you.

Viewing 4 replies - 1 through 4 (of 4 total)

  • 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.

    Thread Starter kittensforgood

    (@kittensforgood)

    @paulwpxp

    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.

    Thread Starter kittensforgood

    (@kittensforgood)

    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?

    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.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Site is not centered on mobile device.’ is closed to new replies.