Community @ The Turning Gate

eshoppy

Member

Registered: 2014-10-03

Posts: 9

display issue of text in table form on mobile devices

Hi,
I have hand coded the fragments to display more text using css. It looks as intended on a big screen, however on small screens the table format scews up and all implodes into one column.

Can I use tables? Any other formatting code?

url is www.katrinnodop.com/info.php

Thanks for suggestions

Matthew

Administrator

From: San Francisco, CA

Registered: 2012-09-24

Posts: 5,795

Website

Re: display issue of text in table form on mobile devices

You may use tables as described here:
http://ce3wiki.theturninggate.net/doku.php?id=tables

---

Matt

The Turning Gate, http://theturninggate.net

eshoppy

Member

Registered: 2014-10-03

Posts: 9

Re: display issue of text in table form on mobile devices

Thanks Matthew

I have coded my tables as in the link provided.

Just noticed, if I reduce the width of my browser window on the big screen to the size of the iPhone, the table also destroys the layout.

rod barbee

Moderator

From: Port Ludlow, WA USA

Registered: 2012-09-24

Posts: 17,830

Website

Re: display issue of text in table form on mobile devices

I noticed you're missing some of the markup like <tbody> and <thead>.

These elements may be needed for correct responsive behavior.

I also noticed a .responsive-table class inside the scaffolding.css file. You could try applying that to the table element:

<table class = "responsive-table">

---

Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site

eshoppy

Member

Registered: 2014-10-03

Posts: 9

Re: display issue of text in table form on mobile devices

Thanks.
Figured it out now. I have a <br> within my cells for the text which I wanted to be below eachother. That screws up the table when minimized.
I will need to configure the column width, remove the <br> and then it should be looking as intended.