Horizontal scroll bars are displayed on tables after publishing

Nicolás February 26, 2020

Hi,

For some reason, horizontal scroll bars are appearing in tables after being published. When editing the page, no scroll bars show up but after publishing there they are. Also, if I collapse the side bar, the scroll bars go away.

 

Thanks in advance!

 

Editing:

Edit view.jpg

Published:

published view.jpg

15 answers

17 votes
Jamie Counsell
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
July 10, 2020

Having the same issue. This is not a feature of responsive websites. We have tables with no content in them, and that display fine in the editor, but not when published.

Robert Gates November 3, 2020

I am struggling with this too. I don't see a horizontal scroll bar when in the editor. The chart only has two words per row and doesn't need a horizontal scroll but it appears when it is published.

Liz D December 4, 2020

This issue has been driving me crazy all year, and it seems like it has actually gotten worse recently.

Even tables on previously published pages that used to display just fine now suddenly have scrollbars. There was one day a few weeks ago where literally overnight, dozens of tables had new scrollbars... even though those pages hadn't even been edited in weeks or months, all the tables got scrollbars for no reason! Ever since then, it has been a nightmare to use tables. Doesn't matter what I do or how I try to fix it, these scrollbars haunt me.

It's unpredictable, too. I've tried to fix pages by deleting the affected table, remaking the entire thing (a waste of time!), and then republishing the page... 80% of the time, the table will have scrollbars all over again. And, randomly, a table will decide on its own to become ridiculously wide and I have zero control over it.

It's ruining so much of our technical documentation by making things hard to read, and it just looks bad. It's so bad and so frequent that I loathe working on any pages that need a table. This is especially frustrating because I utilize things like Page Properties a lot, which requires a table just to function.

Like # people like this
8 votes
Daryl Krzewinski
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
November 11, 2022

By sheer accident I think found a workaround for this issue - at least until Atlassian fixes the core problem.

In my case every single table that inserted the unwanted scroll bar I would simply click the "+" at the top-left of the table (Insert Colum), which should create a blank column to the left of your current leftmost column. Then, click the "delete column" arrow in the blank column you just created, and *poof* the horizontal scroll bar is gone, and your table is unscathed.

I've tried it on about a dozen tables and has worked 100% (so far). Annoying to have to do this, but it's minimal effort and will suffice until the "real" fix comes.

Carole Girard November 15, 2022

All our tables are afflicted with the scroll bar. The work around, to my complete amazement, also works in our environment....   Hoping it will hold in time.

Thanks

Like Daryl Krzewinski likes this
Austin R. Snider
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
November 24, 2022

Also works in our environment. Thanks Daryl!

Like Daryl Krzewinski likes this
Daryl Krzewinski
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
November 29, 2022

@Carole Girard @Austin R. Snider 

Glad it helped! The scroll bars were frustrating me enough that I just started trying stuff to see what kind of result I got and was amazed the create/delete action fixed it so quickly and so easily. 

Michael Proctor
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
November 29, 2022

I found I had to copy the cell content from the column which seemed to cause the issue and add a new column and paste in, then delete the original column.

It is like the column gets stuck with some width attributes at some point.

Like # people like this
Chris Schofield
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
January 10, 2023

Thank you @Daryl Krzewinski! That fixed the issue for me as well and seems to be working after publishing.

Like Daryl Krzewinski likes this
Dobry Kolacz
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
January 10, 2023

You are a hero @Daryl Krzewinski 

8 votes
Tami Checkoway
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
March 22, 2021

This table issue makes confluence impossible to use for specs...which is kinda critical to the point of Confluence! Can we please get an ETA on a fix for this? 

Vincent Azara July 12, 2021

Yep, it's completely ruined the user experience for several use cases.

Like # people like this
6 votes
Gilles Lesire December 7, 2020

It is obvious the Atlassian developers are not reading this thread. Can we file bug reports somewhere? Because this is a huge inconvenient bug that should be resolved. 

Gilles Lesire December 7, 2020

I created a bug report, with a short summarization of the issue and a link to this community page. I hope they will finally pick it up. 

Like # people like this
Laura Rusenstrom July 13, 2021

Hi @Gilles Lesire , do you have a link to the bug report? I'd like to add my vote to it, for what good it will do. It's one thing for me to be frustrated with this problem, but now I have users coming to me complaining about scroll bars on empty tables.

Gilles Lesire July 13, 2021

They simply closed it

Laura Rusenstrom July 13, 2021

disappointed dog.jpg

Heather Blue July 20, 2021

@atlassian-qe not sure who to tag here but can this please be reopened and looked at? A table can be empty and will still generate a horizontal scroll bar even when you expand the table to the max width across the page, and I don't see a way to access the horizontal scroll bar unless you scroll all the way to the bottom of a table, which makes it very challenging to use tables.

Like # people like this
Vincent Azara July 20, 2021

This needs to be looked at again properly by the team @ Atlassian

Adam Oldham
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
September 2, 2021

@Vincent Azara 

I think the problem is more simple than Atlassian or the users here are making in out to be.

Problem seems to be editing any page with existing tables by adding a new table or even adding a row to an existing table.

What I've seen is that the and layout are optimized for the left navigation bar being minimized.  Once the navigation bar is minimized (folded left) the reactive page adjusts and all scroll bars are gone every time.

This is a layout bug with the reactive design in which Confluence creates tables with he assumption of the maximum size based on the current editor's screen/view size.  Preview works, edit works.  Publish screws up as soon as it's displayed because the nav panel is open in most cases.

Like Gregory Jones likes this
Brigt Agnar Mikkelsen
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
September 14, 2021

Try to add an HTML macro and add style

I found that in the innerCell class, overflow-x is set to auto, override it and set it to hidden like this:

innerCell.JPG

Dick April 26, 2024

@Brigt Agnar Mikkelsen this is most likely the culprit. Nested CSS can throw you off the deep end as a dev.

4 votes
Gilles Lesire July 25, 2022

After persistently reporting this bug to Atlassian, they finally flagged it as a confirmed bug.

https://jira.atlassian.com/browse/CONFCLOUD-68891

Thomas Alisi
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
November 7, 2022

thanks for sharing, I've dropped a comment in the bug in the hope someone will notice.

Matt DeVries
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
November 7, 2022

Same here.

3 votes
Gilles Lesire October 21, 2020

I have the same issue. Even for tables where I would just want 2 columns with a 50-50% layout, I get scrollbars. And unless I awkwardly adjust the width of all columns (causing tables to not look similar anymore), scrollbars keep appearing. 

Gilles Lesire October 28, 2020

I've been editing quite some pages and this is the behavior I noticed.

This will help you recreate the issue:

Adding a new table to a new page -> No scroll bars
Editing a page, without touching the table -> No scroll bars
Adding a new table to a page that already had other tables -> Scrollbars on all previous tables, but not on the new table.

Seems like adding a table to a page somehow messes up the width of other tables. 

Like # people like this
Robert Gates November 3, 2020

@Gilles Lesire Great info - very helpful. I wish this didn't happen but it is great to have some framework for what causes it.

Liz D December 4, 2020

Within the last month or so, even this seems to no longer be predictable. A few weeks back, literally overnight, dozens of our pages that hadn't even been edited in months suddenly had scrollbars.

Now, none of it makes sense anymore. Even if I add a new table to a new page and I don't even touch it, it'll randomly have scrollbars after publishing. I feel like I've entered the twilight zone.

Like Cathy Madore likes this
Cathy Madore
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
May 27, 2021

Do we have a fix yet for this issue? I'm literally in tears here trying to get this freaking thing to work. I was so relieved to find that I'm not alone in this frustration. 

Like # people like this
Liz D May 27, 2021

@Cathy Madore We should start a support group or something. I see scrollbars in my nightmares now.

Like # people like this
Gilles Lesire May 27, 2021

No it still has not been patched, more than a year later....
I just let the scrollbars sit there and am waiting for that patch to finally arrive, which might never arrive. 
But expecting users to just adjust the width on every page for every table, and redo that after every minor page edit (which will cause the scrollbars to reappear) is insane. So Atlassian should fix this ASAP imho. 

Like # people like this
3 votes
RPT Admin
Rising Star
Rising Star
Rising Stars are recognized for providing high-quality answers to other users. Rising Stars receive a certificate of achievement and are on the path to becoming Community Leaders.
July 30, 2020

Jumping on this question to report that I'm having the same issue when I convert pages to the new editor. Anyone found a solution - or even a workaround?

I have hundreds of pages to convert. :( 

3 votes
Diego
Atlassian Team
Atlassian Team members are employees working across the company in a wide variety of roles.
February 27, 2020

Hello @Nicolás !

The scroll bars show because the pages have a reactive nature. When elements inside the page move and occupy more or less space, objects within the page will change.

What you are seeing is exactly that. The scrollbars appear in response to the display area for the page being reduced when the sidebar is expanded.

To avoid that behavior I believe that you could display one table under the other or keep the sidebar closed.

I hope this clarifies the behavior Nicolás! Looking forward to your reply

Nicolás February 28, 2020

Thanks for your answer @Diego ! What do you mean with displaying one table under the other? Isn't that how it is now?

Diego
Atlassian Team
Atlassian Team members are employees working across the company in a wide variety of roles.
February 28, 2020

Hi @Nicolás ! I meant to link you to a page from w3schools but forgot. Here it is:

 

What I meant by “display one table under the other” was that instead of displaying them side by side, each inside a column from a layout, we can place one of the tables under the other.  Doing this, we can try to avoid the scroll bar from showing.

 

Let us hear from you!

djordi
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
March 24, 2020

I understand the "reactive nature" of the new editor and appreciate it, despite it not having anywhere near the feature parity of the previous version.

However, it's very clearly bugged. The example above has a table with one column that has a scrollbar appearing. I see the same thing all the time in pages I work on with one or a handful of columns have scrollbars appear for no logical reason.

There is no user on the planet who wants scrollbars to appear in a situation like the one attached or the one above.

bad_table.PNG

Like # people like this
Thomas Epting
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
October 28, 2020

We experience exactly the same problem when using tables in layouts. Interestingly, this was (and still is) not the case for pages that have been edited about 2 weeks ago or earlier. So the issue obviously was fixed and now there is a regression.

Like # people like this
Liz D December 4, 2020

Yea there has definitely been some kind of regression. It has gotten much worse recently. For several weeks now, working with tables has been a nightmare of unpredictably and nonsensical behavior. Even tables that seemed perfectly fine when first published will adopt scrollbars totally randomly. 

Tables in the new editor have always been a little frustrating because they were already a regression compared to the old legacy editor, but now they're nearly unusable.

 

@Diego 

Like Raj Madhuram likes this
Gilles Lesire March 22, 2021

@diego  This bug also occurs when displaying 1 table under another.
Has this issue been reported as a bug or did you just dismiss it? Because we've been waiting for over a year now.

As I explained in other comments, this issue occurs when an the page gets edited, not even touching the table. Even when the table is empty, the scrollbars will appear. On first creation, the table will be fine. Once the page is edited, all previous  existing tables in that page will have scrollbars in all fields, even if they have no content.

Like # people like this
Vincent Azara July 12, 2021

posting here that the issue is still there and it's still a nightmare.

Like # people like this
Carole Girard October 5, 2021

I also have the same problem. But this was not always the case.

And it is also driving me nuts.

@Diego 

1 vote
Gilles Lesire April 28, 2022

Time for all of us to just mass report this to Atlassian via the "Send feedback" feature.
The are obviously just ignoring this thread.

1 vote
Brigt Agnar Mikkelsen
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
September 14, 2021

Try to add an HTML macro and add style

I found that in the innerCell class, overflow-x is set to auto, override it and set it to hidden like this:

innerCell.JPG

Melissa Kummerow
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
November 2, 2021

Hi Brigt - this works while you're in the page, but it doesn't save the formatting universally.   Have you found a way to make every table respond to this, and when you close out of the HTML Macro?     

In other words:  how do you save the setting so that it saves all across the wiki?

 

thanks!

Like Srinatha T likes this
Dick April 26, 2024

can you put it in the master layout as additional css perhaps?

1 vote
Raj Madhuram
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
June 17, 2021

They took something that was working really well, and in order to make it fancy (and look and feel like medium, etc.) have messed it up.

To make the contents of a table not show a horizontal scrollbar, I was looking for table options, which would have been more intuitive. But I figured if you pull the rightmost border of the table, at some point, it makes it non-responsive and would wrap contents instead of showing a scroll bar. 

1 vote
Cerys Hyde November 23, 2020

Having the same issue and it's really frustrating.

In the editor I see no scroll bars. I publish the page, scroll bars appear. I go back into editor, and the scrollbars now show in the editor. I manually adjust the column width to get rid of the scroll bar. I publish the page, scroll bar is gone. 

I could maybe understand the table trying to expand itself to fit a lot of content, and the default action being to do that unless I manually adjust it to be narrower, but I can have tables with content nowhere near the width of the column - scrollbars still appear. There is no reason for the table to decide it needs to be any wider than it was inside the editor view.

Robert Gates November 23, 2020

Check to make sure you don't have a table inside a table. That was my problem in a few cases.

Cerys Hyde November 23, 2020

Nope. I have several tables on one page, but none of them sit inside each other.

Gilles Lesire November 23, 2020

@Robert Gates  That is not even possible in the new editor....

Like Liz D likes this
1 vote
Angela Sadul
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
August 13, 2020

Also having the exact same issue -- columns are difficult to resize and no matter what I do, the scroll bar appears after I save the page. 

0 votes
Annholm Annholm May 31, 2022

@Shannon S @Srinatha T  can someone please do something about this? Numerous users reporting the issue and more than 2 years have passed.

Srinatha T
Atlassian Team
Atlassian Team members are employees working across the company in a wide variety of roles.
May 31, 2022

@Annholm Annholm , I will go through this thread and check if I can do something. mean while if you are on a commercial license please open a ticket with support to look into this. 

 

Thanks,

Srinath T

0 votes
Sudesh kumar
I'm New Here
I'm New Here
Those new to the Atlassian Community have posted less than three times. Give them a warm welcome!
February 26, 2021

There was a table and pre formatted text in one cell (where the scroll bar appeared). This happened after I copied and pasted a row from the same table. Even though there was a table and pre (<pre>) element, it was not visible. The following steps revealed it.

Edited the page (by clicking Edit)

copied the contents of the cell (where the scroll bar appeared )and pasted in notepad ..

a lot of elements like the following appeared.... Deleted all of them and put the text back... The scroll bar disappeared.

 

<col style="width: 188.0px;" /><col style="width: 188.0px;" /><col style="width: 228.0px;" /><col style="width: 120.0px;" /><col sty
le="width: 88.0px;" /><col style="width: 140.0px;" /><col style="width: 103.0px;" /></colgroup><tbody><tr><td class="confluenceTd" style="width: 303.0px;"><pre class="c-mrkdwn__pre">

Suggest an answer

Log in or Sign up to answer
TAGS
AUG Leaders

Atlassian Community Events