Jump to content
iwato

Responsive Design - More iPhone Alignment Problems

Recommended Posts

BACKGROUND:  There appears to be no end to my iPhone alignment woes.  I can only hope that these same problems are not occurring on other devices. 

The DILEMMA:  In the navigation bar of the Grammar Captive mainpage find the menu option GC Tutor under the heading Products and click on the option.  At the outset the alignment should be well-behaved both in your computer and iPhone viewports.  Now scroll down to the section entitled What? in the GC Tutor panel and click on the And much more ... toggle switch at the bottom of the section.  Proper alignment is lost and cannot be regained until one clicks again in the navigation bar.

Unfortunately, all of the old tricks and some newly imposed modifications fail.

Any ideas?

Roddy

Share this post


Link to post
Share on other sites

Is there anything short of forcing a page reload that can resolve this issue?

Roddy

Share this post


Link to post
Share on other sites

It looks like to me you're missing a `float: none;` for that section that you're referring to. 

The specific spot you're looking for is
gc_template.css - Line 112

#middle {
  width: auto;
  width: -moz-auto;
  margin-left: 0px;
  float: none; /* Add this */
}

 

From my end, this looks like it works. Feel free to let me know if it does not.

 

This section, in particular, was escaping the page wrapper, making me think there was some alignment or flex going on. I was not incorrect.

Edited by Funce
  • Like 1

Share this post


Link to post
Share on other sites

Thanks, funce!

Unfortunately, I did not receive your entry until just now.  In a way I am glad,  else I would likely not have fixed other problems associated with the panel.

I just spent the entire day reformatting the entire page.  The use of flex-box has resolved the problem nicely.

Roddy

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...