Layout containers (horizontal, vertical) in Tableau - Real Business Scenario

Scenario Mode

👤 Your Role: You are a business intelligence analyst at a retail company.

📋 Request: Your manager wants a clean dashboard that shows sales performance and customer satisfaction side by side for easy comparison.

📊 Data: You have monthly sales data and customer satisfaction scores by region.

🎯 Deliverable: Create a Tableau dashboard using horizontal and vertical layout containers to organize charts clearly and responsively.

Sample Data

Month	Region	Sales	Customer Satisfaction
Jan	North	12000	85
Jan	South	15000	80
Jan	East	13000	88
Feb	North	14000	87
Feb	South	16000	82
Feb	East	13500	90
Mar	North	15000	86
Mar	South	17000	83
Mar	East	14000	89

1

Step 1: Create two separate worksheets: one for monthly sales by region and one for customer satisfaction by region.

Worksheet 1: Rows = Region, Columns = Month, Values = SUM(Sales). Worksheet 2: Rows = Region, Columns = Month, Values = AVG([Customer Satisfaction]).

Expected Result

Worksheet 1 shows a table of total sales by region and month. Worksheet 2 shows average customer satisfaction by region and month.

2

Step 2: Open a new dashboard in Tableau and add a horizontal layout container to the canvas.

From the Objects pane, drag a Horizontal container onto the dashboard area.

Expected Result

A horizontal container appears on the dashboard, ready to hold multiple items side by side.

3

Step 3: Drag the sales worksheet into the horizontal container on the left side.

Drag Worksheet 1 into the horizontal container.

Expected Result

The sales chart appears on the left side inside the horizontal container.

4

Step 4: Inside the same horizontal container, add a vertical layout container to the right side.

Drag a Vertical container into the horizontal container next to the sales worksheet.

Expected Result

A vertical container appears on the right side inside the horizontal container, next to the sales chart.

5

Step 5: Drag the customer satisfaction worksheet into the vertical container.

Drag Worksheet 2 into the vertical container.

Expected Result

The customer satisfaction chart appears inside the vertical container on the right side.

6

Step 6: Add a title above the horizontal container using a text object.

Drag a Text object above the horizontal container and enter 'Sales and Customer Satisfaction Dashboard'.

Expected Result

A clear title appears above the charts on the dashboard.

7

Step 7: Adjust the size and spacing of containers to ensure charts are balanced and readable on different screen sizes.

Use the dashboard layout pane to set fixed or automatic sizing and add padding as needed.

Expected Result

The dashboard looks neat, with charts aligned horizontally and vertically, and adjusts well on resizing.

Final Result

---------------------------------------------------
| Sales and Customer Satisfaction Dashboard        |
---------------------------------------------------
|  [Sales by Region and Month]  |  [Customer Satisfaction]  |
|                              |                           |
|  (Horizontal container)       |  (Vertical container)     |
---------------------------------------------------

✓Sales vary by region and month, with South region showing highest sales.

✓Customer satisfaction scores are generally high, with East region scoring the highest.

✓Using horizontal and vertical containers helps compare sales and satisfaction side by side clearly.

Bonus Challenge

Add a filter container that allows users to select a specific month and see updated charts dynamically.

Show Hint

Use a vertical layout container to hold the filter above the charts and connect the filter to both worksheets.

Practice

1. What is the main purpose of using layout containers in Tableau dashboards?

easy

A. To organize dashboard items horizontally or vertically for better layout control

B. To create calculated fields for data analysis

C. To connect to different data sources

D. To filter data based on user input

Solution

1. Step 1: Understand what layout containers do

   Layout containers group dashboard elements either side-by-side (horizontal) or stacked (vertical).

2. Step 2: Identify the purpose in dashboard design

   This grouping helps keep the dashboard organized and easier to manage visually.

3. Final Answer:

   To organize dashboard items horizontally or vertically for better layout control -> Option A

4. Quick Check:

   Layout containers = organize items horizontally or vertically [OK]

Hint: Think of containers as boxes that hold items side-by-side or stacked [OK]

Common Mistakes:

• Confusing layout containers with data filters
• Thinking containers create calculations
• Assuming containers connect data sources

2. Which of the following is the correct way to add a vertical layout container in Tableau dashboard?

easy

A. Drag a Horizontal container from the Objects pane

B. Drag a Text object and rename it Vertical container

C. Use the Data pane to create a Vertical container

D. Drag a Vertical container from the Objects pane

Solution

1. Step 1: Identify how to add layout containers

   Tableau provides Horizontal and Vertical containers in the Objects pane for dashboard layout.

2. Step 2: Select the correct container type

   To add a vertical container, you must drag the Vertical container object from the Objects pane.

3. Final Answer:

   Drag a Vertical container from the Objects pane -> Option D

4. Quick Check:

   Vertical container = drag from Objects pane [OK]

Hint: Look in the Objects pane for Vertical container to drag [OK]

Common Mistakes:

• Dragging Horizontal container instead of Vertical
• Trying to rename Text object as container
• Looking in Data pane instead of Objects pane

3. Consider a Tableau dashboard with a horizontal container holding two vertical containers. If you add a new worksheet to the first vertical container, where will it appear?

medium

A. To the right of the existing worksheet inside the first vertical container

B. Below the existing worksheet inside the first vertical container

C. Above the existing worksheet inside the first vertical container

D. Outside the horizontal container

Solution

1. Step 1: Understand container nesting and layout

   A horizontal container arranges items side-by-side. Inside it, vertical containers stack items top to bottom.

2. Step 2: Adding worksheet to first vertical container

   Adding a worksheet to a vertical container places it below existing items in that container.

3. Final Answer:

   Below the existing worksheet inside the first vertical container -> Option B

4. Quick Check:

   Vertical container stacks items vertically = new item below [OK]

Hint: Vertical containers stack items top to bottom [OK]

Common Mistakes:

• Assuming horizontal container stacks vertically
• Thinking new worksheet appears to the right inside vertical container
• Placing worksheet outside containers accidentally

4. You created a dashboard with a vertical container but the items inside overlap and do not stack properly. What is the most likely cause?

medium

A. You accidentally used a horizontal container instead of vertical

B. You did not add the container from the Objects pane

C. You used a floating layout instead of tiled

D. You placed worksheets outside the container

Solution

1. Step 1: Identify layout types in Tableau

   Tableau dashboards support tiled and floating layouts. Floating items can overlap.

2. Step 2: Understand why items overlap in vertical container

   If the container or items inside are floating, they can overlap instead of stacking.

3. Final Answer:

   You used a floating layout instead of tiled -> Option C

4. Quick Check:

   Floating layout causes overlap, tiled stacks properly [OK]

Hint: Use tiled layout for containers to avoid overlap [OK]

Common Mistakes:

• Confusing container type with layout type
• Not checking if items are floating
• Assuming container must be added from Objects pane

5. You want to create a responsive Tableau dashboard where a horizontal container holds two vertical containers. The first vertical container has a filter and a legend stacked vertically. The second vertical container has two worksheets stacked vertically. How should you arrange the containers and items to ensure the dashboard resizes well on different screen sizes?

hard

A. Use tiled layout for all containers and items, nest vertical containers inside horizontal container

B. Use floating layout for containers and items to freely move elements

C. Place all items directly inside a single horizontal container without nesting

D. Use only vertical containers without horizontal containers

Solution

1. Step 1: Understand nesting for responsive design

   Nesting vertical containers inside a horizontal container allows side-by-side and stacked layouts that resize well.

2. Step 2: Use tiled layout for consistent resizing

   Tiled layout ensures items resize and align properly without overlap, unlike floating layout.

3. Step 3: Arrange items inside vertical containers stacked vertically

   Filters, legends, and worksheets stack vertically inside their containers for clarity and responsiveness.

4. Final Answer:

   Use tiled layout for all containers and items, nest vertical containers inside horizontal container -> Option A

5. Quick Check:

   Nesting + tiled layout = responsive dashboard [OK]

Hint: Nest vertical in horizontal and use tiled layout for best resizing [OK]

Common Mistakes:

• Using floating layout causing overlap on resize
• Not nesting containers properly
• Putting all items in one container causing clutter