Hi Team
Looks as though the Column/Accordion/Both is jumping under the left column when the Row is still set to 1/3, 2/3
Row info - you can see the Row is still set to 1/3, 2/3 but the column and its contents (accordion) is slipping under:
Column info:
Note: it does it for a very small portion of screen width as you drag the desktop window thinner, not when you click the default ‘tablet’ view. You can see I’m still set to Desktop view, but I’ve manually resized the window.
Cheers,
Sam
@grannysam11, do you have a link to this live? I cannot replicate this locally with a similar layout / Element combination. If you don’t have a live link, do you know if there’s anything else on your page that could be presenting the issue at hand, such as a width on your Accordion that is pushing it out of the Column?
This is a decent page to review it:
https://wordpress-215979-950751.cloudwaysapps.com/services/support-services/
Manually change your window sizes and you’ll see the render slippage. Row leaks a tonne into mobile width as well that you’ll see.
Hi Sam,
Thanks! Try reducing the font size on your Tabs element further down the page. Looks ok with those accordions, but it’s the total width of the Tabs element that causes the layout to break. If at any point the element width inside your Column exceeds the column width, it will force that column to appear as a new row. You’ve simply run out of horizontal space to work with in your design.
Another way to see it corrected would be temporarily deleting one of the tabs.
Hi Alex
I’m not sure that it’s font size of the Tabs Element? The issue was occurring before I added the Tabs element.
I’ve attached screenshots here where I’ve removed the Max Width and 100% Width entries for the Accordion and Tabs elements (was max width 700px and width 100% for both), however they still leak down and out of the right-column for some reason. I note again this doesn’t appear to occur on the default Pro page breaks, but when you manually resize the browser window.
You’ll see above the faint dotted column line, however the elements are leaking over and ‘below’ the left column as well.
I’ve saved the page for review:
https://wordpress-215979-950751.cloudwaysapps.com/services/support-services/
Thanks
Sam
Here’s another look via the Mobile view - the columns and some elements are leaking over the Row?
Historically the Tab Element would resize to fit within the Row/Column and the Tab Headers would scroll. But I think thats a secondary issue here to the above “window sizing / column leak” issue. Just wanted to point this out as the possible Tab element bug could be throwing off the resolution of the possible column leak bug. Hope that makes sense.
Sam
Hi Sam,
Sorry about that, I’m seeing what’s going on now. I believe this was actually fixed in RC1. You can update, or just wait until RC3 later today
Okay no probs, thanks Alex
Hey Alex
The ‘two column leak’ issue seems to have been resolved with RC3.
However, the Column issue is still evident in RC3?
It seems TABS element is going OUT ) Notice that.
Yep - looks to be the functionality of the Tab Element width that is throwing everything off:
100% width:
200px width:
I’d think the 100% width setup shouldn’t be pushing it to the edges of the ‘screen’ but rather then edge of the Column itself…? @alexander
Hi Sam,
I’m sorry for the delay. We just got back from our Themeco trip to London and we’re working on getting this release ready now. I’ve tested this and it’s not happening for me. 100% width just fills the column, not the screen. I checked with Kory and it might be that this was something corrected based on another issue in RC4. Could you let me know if you’re using the latest version? We will have another RC out as early as today with other fixes, so it might be more efficient to wait for that version.