Problem with align on mobile

horseguards
Offline

Active Subscriptions:

None

11 years 5 months ago - 11 years 5 months ago #49980 by horseguards

Problem with align on mobile was created by horseguards

Hello,

I have a bootstrap template, and I have the login button in "top-a" position. It looks well, but when open in mobile, I am having problems
with the menu icon. See image: awesomescreenshot.com/0bb43xb4e1

Then i changed the login button to "top-b", c or d, but it pushes the logo down. It seems to be that the button has a long div, wide as the template.

How can I solve this?

thanx!!

Last edit: 11 years 5 months ago by horseguards.

The topic has been locked.

mel
Offline

Support Specialist

11 years 5 months ago #49983 by mel

Replied by mel on topic Problem with align on mobile

Could you give me a URL to check this out on? Without seeing the styles and being able to temporarily change them with the browser developer tools, it's really hard to diagnose something like this.

-Melissa

The topic has been locked.

mel
Offline

Support Specialist

11 years 5 months ago #49986 by mel

Replied by mel on topic Problem with align on mobile

The problem is that the menu icon is set with an absolute position. That means it shows in the top left corner, always, and doesn't 'move' other elements around it. You're going to have to add some margin to the SCLogin button to manually adjust it away from the menu item. Something as simple as the below CSS looks to work in the mobile view:

.sclogin-modal-links {
margin-left: 50px;
}

I haven't tested what that does in the desktop view, and you may need to add some additional media query styles to make that margin only apply in the mobile view. Hopefully, that helps you understand the issue more and get you going.

If you need anything else, just let us know!

Thanks,
Melissa

The topic has been locked.

Start
Prev
1
Next
End

SourceCoast Login

Problem with align on mobile