Also, each column takes up the entire screen width on smartphones or small tablets for these web pages. You won't see multiple columns side by side on smaller devices.
http://www.kellycookson.info/
http://www.kellycookson.info/service/index.html
Thanks,
Kelly Cookson
IT Project Leader
Dot Foods, Inc.
217-773-4486 ext. 12676
www.dotfoods.com<
http://www.dotfoods.com>
From: Kelly Cookson
Sent: Thursday, March 01, 2018 11:42 AM
To: Web Enabling the IBM i (AS/400 and iSeries)
Subject: RE: [EXTERNAL] Re: [WEB400] Fluid Grid for Responsive Design [WAS: Re: Express, React, Node.JS]
Hi Nathan,
Are you talking about the simple fluid grid page?
http://www.kellycookson.info/fluidgrid/
I mentioned that this was just a fluid grid, and that a responsive design also required you to deal with things like font sizes, images, and embedded videos. Perhaps I should have stressed that more in my previous email.
I have bad eyesight, so I try to make my fonts readable on smartphones and tablets. I do change my font sizes for my personal website:
http://www.kellycookson.info/ The fonts on this page and the pages in the navigation drop-down should be easier to read on mobile devices.
I agree that a fluid grid design is not necessary. I'm sure the way you describe here works, too:
https://rd.radile.com/rdweb/info2/ibmiui10.html
I have a question, though. In the CSS code, you set the .w2 class to a specific width.
* Suppose I want a row where the first column takes up 25 percent of the page and the second column takes up 75 percent of the page.
* Then, in the next row, I want three columns that each take up 33 percent of the page.
* Then I want another row with two columns, where each column takes up 50 percent of the page.
One of my web pages actually does this:
http://www.kellycookson.info/service/index.html. Using your system, wouldn't I have to define a number of CSS classes, not just the single .w2 class set at a specific width? Right now that seems like the advantage of a fluid grid framework. But I'm not very familiar with your approach. Maybe I am missing something.
Thanks,
Kelly Cookson
IT Project Leader
Dot Foods, Inc.
217-773-4486 ext. 12676
www.dotfoods.com<
http://www.dotfoods.com>
From: WEB400 [mailto:web400-bounces@xxxxxxxxxxxx] On Behalf Of Nathan Andelin
Sent: Thursday, March 01, 2018 10:54 AM
To: Web Enabling the IBM i (AS/400 and iSeries)
Subject: [EXTERNAL] Re: [WEB400] Fluid Grid for Responsive Design [WAS: Re: Express, React, Node.JS]
On Thu, Mar 1, 2018 at 8:55 AM, Kelly Cookson <KCookson@xxxxxxxxxxxx<mailto:KCookson@xxxxxxxxxxxx>> wrote:
I use a responsive 12 column grid for my personal web development and
don't really have problems with it.
I just viewed the link you provided using the iPhone 4 emulator in Chrome,
then viewed it with my iPhone 6. The text in the boxes are highly
compressed, with varying font sizes, depending on the number of columns
displayed in your grid. People shouldn't need to pull out a magnifying
glass to read tiny text. Your grid system doesn't allow column content to
flow left-to-right, top-to-bottom. Were you aware of these problems?
Your CSS-based grid system is very simple, and may not have the complexity
that I referred to in my article. But it doesn't do what needs to be done,
in my opinion.
--
This is the Web Enabling the IBM i (AS/400 and iSeries) (WEB400) mailing list
To post a message email: WEB400@xxxxxxxxxxxx<mailto:WEB400@xxxxxxxxxxxx>
To subscribe, unsubscribe, or change list options,
visit:
https://lists.midrange.com/mailman/listinfo/web400<
https://lists.midrange.com/mailman/listinfo/web400>
or email: WEB400-request@xxxxxxxxxxxx<mailto:WEB400-request@xxxxxxxxxxxx>
Before posting, please take a moment to review the archives
at
https://archive.midrange.com/web400<
https://archive.midrange.com/web400>.
midrange.com
