Button Box is removing some Nav Overlay margin!

Wonder if someone can have a look at this and see if they can work out what is going on?

The problem appears to me that Button Box appears to be removing the right margin from the Nav Overlay stack.

You’ll need to hit up these two pages in Chrome Inspect to see what I mean…

You should be able to see the difference. I can’t work out why, anyone able to help?

Any chance you can reference what the Button Box stack is, as I am unfamiliar with the stack, who makes it and what it is used for.

Sorry, got the name wrong, it’s Badge Box!

If you scroll down the page called “with” it’s got about five instances of it. If I remove these, the Nav Overlay works as expected.

Also if you can point out what is specifically different that would be very helpful, because at first glance I’m not sure what specifically you’re looking at and I’m not seeing anything that stands out as different visually, and I’d like to make sure we’re on the same page with what the problem is before I start hunting a solution. Screenshots or videos are always helpful.

The page with the Badge Box stacks the Nav Overlay menu is right over to the right…

I suspect this is just something to do with the Chrome browser’s responsive view. As when I view it on my iPhone, or in Safari’s responsive design viewer this does not occur. Both pages look identical. They even look identical within mobile Chrome on my iPhone. Give both pages a test on native devices and you should see them looking the same in both.

Sadly not. Had already tested on Android, it appears the same as in Inspect. Not got round to iPhone testing yet.

Must just be a Chromism.

I’ll bog a fix with a margin stack or summit.

I am unfortunately not seeing any differences here in any browser or on any device I own. I’ll look closer at the stack, but there shouldn’t really be anything within the Badge Box stack that would affect the toggle for the Overlay Navigation.

You can’t affect the placement of that overlay toggle with a Margins stack.

Did you look at it on an Android?

But yes, there really isn’t any reason for this to happen, I expected it to be one of the other non-Foundry stacks on the page causing it.

But, if you don’t see it on Android, it’s just some nutty nonsense happening this end. Which isn’t unusual.

I don’t own a native Android device.

OK, well, for your info the problem does appear on Android with this particular project. Once I’ve done with this one I’ll put together a really simple one and see if it still exists (it might be a combination of stuff on those linked pages). If it does I’ll let you know.

Fair point.

Eh Gary, whilst you’re here. Any idea how to make the Magellan Link2 scroll smoothly to a Magellan Marker in Foundry?

I know the stacks are asking for the Foundation site styles, but obviously that ain’t there. It works, it just jumps opposed to scrolls.

Think you have the wrong thread. That being said, you’ll want to probably take this to the Magellan support area most likely.

LOL, ya, sorry. Been a long day! I’m only trying Magallen as I can’t work out how the anchor stack works!

I have a contact form at the bottom of each page, I want various “Contact Us” buttons on the page to link to it, I want the page to scroll smoothly down to the contact form once click.

Is this poss with native Foundry stacks?

Yes, you can do what you’re looking to do with the Scroll To stack.


D’oh! I knew it existed, just couldn’t see the wood for the trees!

Ta. Doggy walking, then back at it.


Coming back to the original post issue now.

@elixirgraphics can you confirm if you are or are not seeing the described issue in the linked pages at the top.

The issue is displayed in the image posted.

I’ve had quite a few people test this now, and all are seeing it. I’m not sure from your posts above if you’re seeing or not though.


See below.

While I see the problem in your screenshot fine, I cannot replicate it here whatsoever. Without being able to replicate the problem that you’re running into, it is very hard to work on a solution. I will take a look at it as I said, but again, if I can’t make it have the problem here so that I can study and troubleshoot the problem, then it will take quite a deal of time to address it, if I can at all. It has been added to my internal issue tracker as of yesterday.

Yep, get that. And it was that about which I wasn’t sure. I understand you don’t have an Android device for real world testing, but wasn’t sure if you were able to at least see the issue in the Chrome Inspector. To be honest, I’m still not sure! I had several other people look at the pages in Chrome Inspect and they saw the issue, but I’m getting the impression it’s not happening for you? Can you confirm one way or another?

I didn’t realize you were wondering if I saw it in the device emulator mode of Chrome. I’d assumed we were talking about real world use cases. I can replicate it in the device simulator in the Chrome browser. But no where else. I am not sure that is a good test case or not comparative to a real device. I’ll keep it in mind for testing this problem.

1 Like