Table Border in Confluence

[J]

Hi,

I am trying to hide the table borders in Confluence but to no avail.

I have done some research on the web and here but it doesn't look like the question has been answered or it was referring to older versions of Confluence.

I have been trying to make it work with Table Plus as well but does not seem to work with Border = 0

Would be great if someone could help.

Thanks.

[Mark Thompson]

This really should be a checkbox or something. And it should be something you don't have to buy a plugin for. Seriously, this is the most basic html. It can't be a fix requiring a lot of resources. We've been asking for this for a couple of years now. Is Bob Swift blackmailing somebody at Atlassian? Does he have pictures from your last Christmas party? Just let us turn off borders on a table.

[Thomas Schubert]

Yes, it's a shame.

I've helped myself with Section(column()Column()) elements. So I build up a structure with columns and no borders.

[Stephen]

Yeah it looks like there is a kind of plugin mafia. Atlassian doesn't deliver basic plugins such as tabs, border removing on tables, etc... just to get royalties from the plugin vendors... A SHAME...

[Marc Moroz]

I'm continuously amazed at the lack of basic support.  It's something people need to know about before getting involved with Atlassian.

[Swapna Veer]

I partially do not agree, as Jira support major chuck for a Project Manager. Beautification can always be outsourced. 

[Sarah Dosanjh]

Can anyone tell me if we can change table border colors? - e.g. light grey to black borders or different color.  If not this a good feature to include in next version of Confluence. It would be good to have more colors for cell colors or row or column colors as well.

[Deb Taylor]

People have been asking for a check box (to turn on/off borders) for YEARS. I am incredibly amazed that this feature has not been created. This is part of why we are close to dropping Atlassian.

[Stephen]

I totally agree with you. I've sent a lot of emails to complain about this "plugin strategy". They prefer to get royalties from the plugin vendors than respecting their customers. Atlassian don't care about their customers, they just want money. Why is it impossible to do tabs for example? We have to pay thousands euro to get that from the servicerocket company. A SHAME. Same for basic functionnalities like borders, etc... Atlassian simply don't care it is like selling a car without electric glass and have to pay a garage to get this extra functionnality. If they continu like this they will loose their customers, as Google will arrive on the market with a better solution...

[John]

Copy and paste from a Google Sheet to Confluence.  The resulting table will not have borders.

I would like to see the option to turn borders on and off.

[R Donato]

I agree!

[Blake Masri]

Genius! At first I was like it didn't work but then I realized duh I need to make the border white in google sheets. THANK YOU!

[Theo Wessels]

I tried, but it dosn´t work 

[Paul Harding]

doesn't work for me either... This is ridiculous.. 

Ready to leave Confluence for Wordpress.. The amount of basic features missing is horrible.  Only reason I'm even attempting this is because I can't get text to show up beside an image... 

[Mikhail Kotov]

Works with Excel as well (don't create a table, just copy plain cells)

[Eliot Cole]

Doesn't work with Excel anymore, btw, folks.

Honestly, there's no better way I've found than to include the tiniest bit of CSS to just kill their selector:

.confluenceTd { border-color: white !important; padding: 0px !important;}

I know we aren't allowed to use CSS because it'll make new users scratch their heads and worry ... however I'm finding that just one line is probably OK here and there, since the damned thing ignores anything you put in the styling boxes. 

[Shawn Connelly]

Is there a way to insert that css into a Confluence Cloud page? :(

[David at David Simpson Apps]

No, sorry.

[Ismael Carlo]

Hi All,

I couldn't get any of the suggestions to work for me so I modified @Rachael Birky's suggestion.  Here's what I ended up with.  All the details are included for those who are new to User Macros.  

User Macro

Macro Name: Borderless-Table

Visibility: Visible to all users in Macro Browser

Macro Title: Borderless Tables

Description: Tables contained within this macro will have no borders.

Categories: Formatting

Icon URL:  Optional

Documentation URL: https://answers.atlassian.com/questions/180228

Definition of User Macro

Macro Body Processing: Rendered

Template:

## Macro title: Borderless Table
## Macro has a body: Y
## Body processing: Selected body processing option
## Output: Selected output option
## Developed by: Rachael Birky
## Modified by: Ismael Carlo
## Date Last Modified: 1/7/2015
## @param borderless-table:title=Tables without Borders

<style>
#borderlessTableWrapper Th { border: 0; }
#borderlessTableWrapper Td { border: 0; }
</style>

<div id="borderlessTableWrapper">
$body
</div>

[Jim Bethancourt]

I also added the following line in the <style> section: #borderlessTableWrapper Table { width: 100%; }

[boardtc]

This works but there is an issue showing an info macro in one of the cells, the title of the info macro is shown but not the body  I wonder why setting border to 0 for <th> & <td> would affect this macro rendering...

[boardtc]

We upgraded to v 5.9.6 and this now works 

[Job Wolters]

Does it still works with confluence 5.10.8? We've updated it and now, when using the note macro into the borderless table macro nothing is shown.

[R Donato]

I created a user macro to remove the table border.

Here's the code:

_____________________________________

Category: formatting

Definition of User Macro: Rendered

## @param borderless_tables:title=Tables without Borders

<style>
#com-atlassian-confluence th,
#com-atlassian-confluence td,
#com-atlassian-confluence .confluenceTh,
#com-atlassian-confluence .confluenceTd {
border: 0;
}
</style>

<div id="tableWrapper">
$body
</div>

__________________________________________

HTH,

Rosemary

[Stephen]

Many thanks guys it is a cool solution, and free...

[Deleted user]

Added the style suggested by Rosemary without the <style> tag  in a page using the CSS macro, as follows:

#com-atlassian-confluence th, 
#com-atlassian-confluence td,
#com-atlassian-confluence .confluenceTh, 
#com-atlassian-confluence .confluenceTd {
border: 0;
}

It worked for the tables in the page.

[Henk Keuris]

Thanks! This worked for me (none of the other Macros above worked).

Thanks for the share!

[Joi Whetstone]

Thanks Rosemary & Mike. This worked. 

[Peter_Steven_Price]

We are not allowed to add macros. Is there something that we can do to remove columns via direct source entry (which we can DO)

[Rachael Birky]

Not sure if this helps, but...

I created a new macro and used this code:

<style>
tableWrapper.confluenceTh {
        border: 0;
    }
tableWrapper.confluenceTd {
        border: 0;
    }
</style>

<div id="tableWrapper">
$body
</div>

Then the style only applies to tables in the macro, so put only the tables that need 0 border width in the macro.

[R Donato]

Hi Rachael,

Thanks for provided the code. I created a macro. But when I add a table, I still get borders. Can you please provide the rest of the information you used for the template? I probably made a mistake there.

Thanks,

Rosemary

[David at David Simpson Apps]

@Jennifer Wong: Try adding something like this to Confluence Admin | Look & Feel | Custom HTML | At the end of the HEAD

<style>
	#com-atlassian-confluence th, 
	#com-atlassian-confluence td,
	#com-atlassian-confluence .confluenceTh, 
	#com-atlassian-confluence .confluenceTd {
		border: 0;
	}
</style>

It should wipe out all table borders in every space.

[Thomas Schubert]

I'd need boderless table only some times, not for all tables.

Is there a way to get that (without having table plus macro)?

(Confluence 5.1.4)

Thomas

[Bob Swift]

Use the css macro (Content formatting macros) with the above suggestion on the page you need it.

[Thomas Schubert]

Sorry, for that we had to buy the Content formatting macros - that's unfortunately not so easy ...

Thomas

[Lars Swart]

Hi, I used this version since 2016 on my server appliance.

It worked fine. But we are on Confluence 7.4.4 now and the macro doesn't seem to do its job anymore.

The borders are gone, but the complete table has a grey background now.

Does anybody know why this is happening, and what to do about it?

## Macro title: Borderless Table
## Macro has a body: Y
## Body processing: Selected body processing option
## Output: Selected output option
## Developed by: Rachael Birky
## Modified by: Ismael Carlo
## Date Last Modified: 1/7/2015
## @param borderless-table:title=Tables without Borders

<style>
#borderlessTableWrapper Th { border: 0; }
#borderlessTableWrapper Td { border: 0; }
</style>

<div id="borderlessTableWrapper">
$body
</div>

[Roman Joss]

Hi Lars
I've tested this macro on Version 7.4.9.
As defined, the borders are set to 0 and no border are visible.
The Background of the table is still without color. 
For me it seems to work as defined.
Regards, Roman

[Lars Swart]

Hi Roman,

what Browser did you use?

Lars

[Roman Joss]

Hi Lars
Chrome Version 91.0.4472.77

Roman

[Roman Joss]

Works also with Firefox 19.0 and Edge Version 89.0.774.54

[Lars Swart]

Found the error. The behaviour I described is only there if I put the borderless table user macro inside of a "Scroll Ignore" by k15t Scroll PDF Exporter.

[David at David Simpson Apps]

These answers which use an id rather than a class as the wrapper element should only work properly if there is a single border less table on the page. 

Change to using a class and you’ll have valid html if more than one borderless table is added. 

[Matthew Beda]

Another option: User Macro

Macro Name: tablestripe

Visibility: Visible to all users in Macro Browser

Macro Title: Table Striper

Description: Define Border and Striping for nested Table.

Categories: Formatting

Icon URL:  Optional

Rendered: Checked

{code}

## @Param Border:title=Table Cell Borders|type=enum|enumValues=Top,Bottom,All,None|default=All|desc=Choose Table Border Settings
## @Param Striped:title=Stripe Table|type=boolean
<style>
.TableStriper.border-Bottom table td,
.TableStriper.border-Bottom table th {
border: none;
border-bottom: 1px solid #ccc;
}
.TableStriper.border-Top table td,
.TableStriper.border-Top table th {
border: none;
border-top: 1px solid #ccc;
}
.TableStriper.border-None table td,
.TableStriper.border-None table th {
border: none;
}

.TableStriper.striped-true table tr:nth-child(odd) td {
background: #f9f9f9;
}
</style>

<div class="TableStriper border-$paramBorder striped-$paramStriped">
$body
</div>

{code}

[Roman Joss]

Hi @Matthew Beda 
That is a great example, many thanks. 
I'm trying to enhance with background-color and font-color for the heading-style. But i get to no results. I've tried the following:

.TableStriper.border-None div tablesorter-header-inner {
background-color: #092768 !important;
color: #FFFFFF !important;
}

Do you have a hint with which parameter i can change this?
Many thanks!
Roman

[Matthew Beda]

The Background color is typically applied to the TH. Try this.

.TableStriper.border-None table.tablesorter>thead>tr>th {

        background-color:#092768 !important;

        color:#FFF !important;

}

You may want to set this Color as a Param in the macro and utilize it much like the border paramater.

## @Param HeaderColor:title=Header Color=enum|enumValues=Default,Grey, Black, Red,Green|default=Default|desc=Choose a color for the Table Header

Add the Param to the Same place as the Border Param.

And Define a CSS Styl for each Color Param

.TableStriper.Red table.tablesorter>thead>tr>th {

        background-color:Red !important;

        color:#FFF !important;

}

[Roman Joss]

Hi @Matthew Beda 

That's great, thanks. I'm coming closer to use userfriendly macros.
By point was to define a color just for the heading-rows/columns. If i use 'background-color' the whole table is colored. Do know which style I have to declare just for the header-rows?
I've tried with 'tablesorter-header-inner', but this do not work.

[Ravee Panjwani]

I tried something that worked. While using table-plus, enter the following for your column, row, or table style.

border-left:#ffffff solid; border-right:#ffffff solid; border-bottom:#ffffff solid; border-top:#ffffff solid

[Ravee Panjwani]

Alternately use:

border-left:hidden; border-right:hidden; border-top:hidden; border-bottom:hidden

[Mark Thompson]

Works beautifully. Thank you, @Ismael Carlo !

[Uwe Gehring]

Thanks to @Rachael Birky and @Ismael Carlo this works very well!

[Steve Rhodes]

@Rachael Birky's code worked for me. Additional thanks to @Ismael Carlo for cleaning it up and making it easier.

[Bob Swift]

For table-plus, set class to blank and border to 0.

[J]

Hi Bob,

Thanks for the answer.

Not sure if I am doing it wrong...but at the start of the macro it has:

Table Plus | class | border=0

Have I missed something?

Thanks

[Bob Swift]

That should work and does in my test. Open an issue if not.

[J]

Hi Bob,

I am using Zen Foundation. Has there been any issue regarding borders reported with confluence users who have this add-on?

Thanks.

[Bob Swift]

Not that I am aware of.

[Allison Landry]

Hello, are there updated instructions on how to make this work with Confluence 6.6? When I try to leave the class blank, set border to 0 and then save the page, the borders are still visible. When I edit the page again, the class has reverted to "@default". Thanks!