New Topic Subscription Options |
Responsive Design and Tables
Forums: Questions and Answers About Building Your Site | |||
|
|||
Participant: Log in to see names |
Tuesday, January 17, 2017 at 6:13 PM
I have a number of tables in my site as well as photo files (mostly png)and when I view them on my cell phone the cells in the tables don't "stack" like the photos and text do. I have to scroll to the right to see the whole tables with multiple cells. I have tables on the "New Here" page that do this. Is there some way to handle this or is it just a bad idea to use tables in Responsive Design? The site that I am worried about is http://www.classcreator.com/Redmond-Oregon/class_index.cfm
|
||
|
|||
Participant: Log in to see names |
Tuesday, January 17, 2017 at 6:16 PM - Response #1
Where is the "New Here" page? Is it called "New Here"?
|
||
|
|||
Participant: Log in to see names |
Tuesday, January 17, 2017 at 6:27 PM - Response #2
It's not on the high school site, it's on the one I am working on for our church -- but not active yet. http://www.classcreator.com/Redmond-Oregon/class_index.cfm Yes, it is the page called "New Here" Sorry for the confusion but use the site to the left. Jim
|
||
|
|||
Participant: Log in to see names |
Tuesday, January 17, 2017 at 6:37 PM - Response #3
As in the other response, RD design requires one to MANUALLY edit the source or use an alternate design. The Editor is pretty basic html oriented. Basic tables do not work because you've given them absolute dimensions, not RD type constructs. CSS is one of the methods that gets RD designs to work properly. This LINK is a good article even though it's old. Ignore the IE9 comment there. The one about turning a table into a mini-graphic is pretty easy if it fits the goal. Jim Persing wrote: I have tables on the "New Here" page that do this. Is there some way to handle this or is it just a bad idea to use tables in Responsive Design
|
||
|
|||
Participant: Log in to see names |
Tuesday, January 17, 2017 at 6:45 PM - Response #4
For example, to illustrate how a table with absolute sizing is the issue, take the text that is now in a table and just remove this table size (style="height:200px;width:700px;"). The text automatically now resizes correctly. Do a google search "responsive table design" to get other ideas.
|
||
|
|||
Participant: Log in to see names |
Tuesday, January 17, 2017 at 6:56 PM - Response #5
Another example: To get the Welcome image to resize correctly edit the absolute dimensions. Change style="width: 1000px; height: 211px;" to style="width: 100%" (or make the percent less than 100 to get what you want. Now the image resizes correctly.
|
||
|
|||
Participant: Log in to see names |
Wednesday, January 18, 2017 at 1:59 AM - Response #6
Thanks, Jack. I will certainly try these tips. I am anxious to get the Responsive Design to work correctly.
|
||
|
New Topic |
Subscription Options: Have all new forum posts sent directly to your email. |
Subscription options are available after you log in. |