---
title: "Column Width Example with Fixed Layout"
canonical: "https://support.appfire.com/space/TBL/74815372/Column%20Width%20Example%20with%20Fixed%20Layout"
format: markdown
---
# Description

Specific example with fixed layout. See also [Controlling the Width of Table Columns](https://appfire.atlassian.net/wiki/spaces/TBL/pages/74814782).

Links to examples defined on this page:

- [Example 1](#ColumnWidthExamplewithFixedLayout-at7x_fixedColWidth_Ex1): Responsive Confluence table with defined macro column styles
- [Example 2](#ColumnWidthExamplewithFixedLayout-at7x_fixedColWidth_Ex2): Fixed width Confluence table with defined macro column styles
- [Example 3](#ColumnWidthExamplewithFixedLayout-at7x_fixedColWidth_Ex3): Responsive Confluence table with the *Table style* macro parameter
- [Example 4](#ColumnWidthExamplewithFixedLayout-at7x_fixedColWidth_Ex4): Fixed width Confluence table with the *Table style* and *Table width* macro parameters
- [Example 5](#ColumnWidthExamplewithFixedLayout-at7x_fixedColWidth_Ex5): Responsive Confluence table with the *Table width* macro parameter
- [Example 6](#ColumnWidthExamplewithFixedLayout-at7x_fixedColWidth_Ex6): Fixed width Confluence table with the *Table width* macro parameter

# Links

- [Column Width Example with Fixed Layout and Break-word](https://appfire.atlassian.net/wiki/spaces/TBL/pages/74814831)

# Parameter values

<span style="color: #000000">The following macro parameter setting is common to all tables i</span><span style="color: #000000">n succeeding set of examples:</span>

| ***Column styles*** | *width:500px,width:1000px,width:50px,width:50px,width:50px,width:50px,width:50px,width:50px,width:50px,width:50px,width:50px,width:50px,width:50px,width:50px,width:50px,width:50px* |
| --- | --- |


> ✅ **Wrap long words**
> ✅ 
> ✅ If you want long words to be wrapped instead of overflowing the column, add *word-wrap: break-word;* to *Table style*.

# Examples of table column width behavior relative to Confluence table settings

You can influence the table column widths using the the Confluence Table toolbar table width settings as shown:

![image](media://bf0ed1c3-399c-4d6a-8e4e-1fe5fe2fe5c5)

The succeeding set of examples shows how the Confluence table width setting influences a table column width with just the *Column styles* macro parameter setting.

## > Macro (anchor)

<span style="color: #000000">Example 1</span>

| **Confluence table toolbar setting** | Responsive |
| --- | --- |

> Macro (table-plus)
> 
> | **A** | **B** | **C** | **D** | **E** | **F** | **G** | **H** | **I** | **J** | **K** | **L** | **M** | **N** | **O** | **P** |
> | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- |
> | > Macro (loremipsum) | > Macro (loremipsum) |  |  |  |  |  |  |  |  | > Macro (loremipsum) |  |  |  |  |  |

## > Macro (anchor)

<span style="color: #000000">Example 2</span>

| **Confluence table toolbar setting** | Fixed width |
| --- | --- |

> Macro (table-plus)
> 
> | **A** | **B** | **C** | **D** | **E** | **F** | **G** | **H** | **I** | **J** | **K** | **L** | **M** | **N** | **O** | **P** |
> | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- |
> | > Macro (loremipsum) | > Macro (loremipsum) |  |  |  |  |  |  |  |  | > Macro (loremipsum) |  |  |  |  |  |

The succeeding set of examples show how the table column width changes as per the *Table style* and *Table width* macro parameters in conjunction with the Confluence table width settings.

## > Macro (anchor)

<span style="color: #000000">Example 3</span>

| **Confluence table toolbar setting** | Responsive |
| --- | --- |
| **Macro editor parameter settings** | *Table style* | *table-layout: fixed;width:100%* |

> Macro (table-plus)
> 
> | **A** | **B** | **C** | **D** | **E** | **F** | **G** | **H** | **I** | **J** | **K** | **L** | **M** | **N** | **O** | **P** |
> | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- |
> | > Macro (loremipsum) | > Macro (loremipsum) |  |  |  |  |  |  |  |  | > Macro (loremipsum) |  |  |  |  |  |

## > Macro (anchor)

<span style="color: #000000">Example 4</span>

| **Confluence table toolbar setting** | Fixed width |
| --- | --- |
| **Macro editor parameter settings** | *Table style* | *table-layout: fixed;* |
| *Table width* | *100%* |

> Macro (table-plus)
> 
> | **A** | **B** | **C** | **D** | **E** | **F** | **G** | **H** | **I** | **J** | **K** | **L** | **M** | **N** | **O** | **P** |
> | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- |
> | > Macro (loremipsum) | > Macro (loremipsum) |  |  |  |  |  |  |  |  | > Macro (loremipsum) |  |  |  |  |  |

## > Macro (anchor)

<span style="color: #000000">Example 5</span>

| **Confluence table toolbar setting** | *Responsive* |
| --- | --- |
| **Macro editor parameter setting** | *Table width* | *50%* |

> Macro (table-plus)
> 
> | **A** | **B** | **C** | **D** | **E** | **F** | **G** | **H** | **I** | **J** | **K** | **L** | **M** | **N** | **O** | **P** |
> | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- |
> | > Macro (loremipsum) | > Macro (loremipsum) |  |  |  |  |  |  |  |  | > Macro (loremipsum) |  |  |  |  |  |

## > Macro (anchor)

<span style="color: #000000">Example 6</span>

| **Confluence table toolbar setting** | *Fixed width* |
| --- | --- |
| **Macro editor parameter setting** | *Table width* | *50%* |

> Macro (table-plus)
> 
> | **A** | **B** | **C** | **D** | **E** | **F** | **G** | **H** | **I** | **J** | **K** | **L** | **M** | **N** | **O** | **P** |
> | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- |
> | > Macro (loremipsum) | > Macro (loremipsum) |  |  |  |  |  |  |  |  | > Macro (loremipsum) |  |  |  |  |  |