Author Topic: Pages no scrollbars on mobiles  (Read 180 times)

0 Members and 0 Guests are viewing this topic.

Offline DOKEEFFE

  • Newbie
  • *
  • Posts: 13
  • Karma: 0
    • View Profile
Pages no scrollbars on mobiles
« on: July 01, 2018, 03:52:41 pm »
Hi,


I've recently joined yourselves. I run the forum https://comeallwithin.createaforum.com/ for rugby fans of Harlequins premiership team.


My HTML/CSS skills are coming on a storm (from near zero!) but I'm stuck on this - wanting to use ezportal pages (where I want somewhere I can easily knock up match reports/team news etc...) linked from messages. So for example I would just say "here is the current team status" and link to https://comeallwithin.createaforum.com/index.php?action=ezportal;sa=page;p=1


Unfortunately that page doesn't come over well on a mobile screen. I only see the first three cells of the table. I can scroll up and down it, but not left/right. I can't pinch it to make it smaller/larger. I can go to the full site and then back to mobile, but that is a pain.  Is there some way of changing the CSS / HTML to put scrollbars on the screen or some such? I was trying to use "overflow" but not having much success.


Thanks

Social Buttons


Offline DOKEEFFE

  • Newbie
  • *
  • Posts: 13
  • Karma: 0
    • View Profile
Re: Pages no scrollbars on mobiles
« Reply #1 on: July 01, 2018, 09:02:24 pm »
Actually have the same problem if this is posted in a message.
See https://comeallwithin.createaforum.com/general-discussion/squadcontractsinjuries/?message=486


Looks fine on a desktop but unusable on a mobile.


Thoughts?

Offline DOKEEFFE

  • Newbie
  • *
  • Posts: 13
  • Karma: 0
    • View Profile
Re: Pages no scrollbars on mobiles
« Reply #2 on: July 05, 2018, 05:38:40 pm »
OK - problem is that we are using tables. Ordinary text flows OK but tables don't.
My solution occurred when I noticed that text encased in the [ code] [ /code] tags could be moved left/right on mobile phones.

So solution 1 is simply write your table within the [ code] [ /code] tags.

Solution 2 comes from seeing the < code class="bbc code">
I simply wrapped the table code in a < div>  set of tags where

<div style="    display: block;  font-family: courier new; font-size: normal;
    background: #eef;  border-top: 2px solid #999; border-bottom: 2px solid #999;
    line-height: 1.5em; padding: 3px 1em; overflow: auto;
    white-space: nowrap;     max-height: 250em;">

Now the table can be moved left/right on a mobile phone as well as up/down.

Problem solved.

Offline CreateAForum

  • Administrator
  • *****
  • Posts: 5182
  • Karma: 271
    • View Profile
Re: Pages no scrollbars on mobiles
« Reply #3 on: July 05, 2018, 06:21:45 pm »
Good job!
Like Create A Forum? Support me at https://www.patreon.com/vbgamer45/

 

Related Topics

  Subject / Started by Replies Last post
2 Replies
222 Views
Last post November 24, 2014, 02:06:18 pm
by Conor Copeland
3 Replies
476 Views
Last post February 11, 2015, 08:18:56 pm
by CreateAForum
1 Replies
241 Views
Last post October 25, 2015, 05:47:12 pm
by CreateAForum
3 Replies
446 Views
Last post October 23, 2017, 09:28:45 pm
by CreateAForum
15 Replies
284 Views
Last post January 25, 2018, 07:29:56 pm
by CreateAForum