Tag Archives: percentage

SVG and Gradient Fraction Game Tutorial

To add onto yesterday’s Gradient Fraction Game Mobile Tutorial … exclusively gradient … conic linear radial … “cake” displays in our Fractions Game … and add in … SVG circle and rectangle alternative displays … it is not hard coding … Continue reading

Posted in eLearning, Event-Driven Programming, Games, Tutorials | Tagged , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , | Leave a comment

Gradient Fraction Game Mobile Tutorial

Many responsive web design purists will push the web developers out there to never … express HTML element dimensions in “static” “px” types of units … but rather … express HTML element dimensions in “%” or “vx” or “vh” proportional … Continue reading

Posted in eLearning, Event-Driven Programming, Games, Tutorials | Tagged , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , | Leave a comment

Flex Box CSS Primer Tutorial

To use percentage (%) units in CSS in a web application can be a conduit towards Responsive Web Design goals you have. But have you considered the “Flex Box” as another approach? CSS3 flexible Box, or flexbox is a new … Continue reading

Posted in eLearning, Tutorials | Tagged , , , , , , , , , , , , | Leave a comment

CSS Units of Measure Primer Tutorial

As with HTML/Javascript Units of Measure Game Tutorial (which we tweaked this way to fix Google urls) you get to appreciate the myriad of choices out there for you in terms of styling lengths and widths and sizes of webpage … Continue reading

Posted in eLearning, Tutorials | Tagged , , , , , , , , , , , , , , , | Leave a comment

Viewport and CSS Calc Intersection Resize Tutorial

Yesterday’s Viewport and CSS Calc Intersection Algorithm Tutorial showed no issues with … mobile “pinch” and “spread” gestures … no issues surprisingly … but there were with … non-mobile “onresize” (of window) created issue of a misplaced yellow intersection HTML … Continue reading

Posted in eLearning, Event-Driven Programming, Tutorials | Tagged , , , , , , , , , , , , , , , , , , , , , , , , | Leave a comment

Viewport and CSS Calc Intersection Algorithm Tutorial

Do you eat “separatist style”? I used to, leaving the good stuff until last, until one day a grandparent kindly taught me the weakness with this system, quietly pinching the best stuff during the prelude period. The recent Viewport and … Continue reading

Posted in eLearning, Tutorials | Tagged , , , , , , , , , , , , , , , , , , , , , , | Leave a comment

Viewport and CSS Calc Primer Tutorial

Keeping on with some themes of yesterday’s Responsive Design Viewport Width Considerations Tutorial, today, we combine ideas around … (meta) viewport … and … (CSS) calc … in a “proof of concept” web application we are using to explore ideas … Continue reading

Posted in eLearning, Tutorials | Tagged , , , , , , , , , , , , | Leave a comment

Textarea Width and Height Control Primer Tutorial

Continuing on the theme of HTML5 new elements (and features), HTML input types in today’s case, as for the previous Colour Discernment Game Primer Tutorial‘s case (of the new HTML5 type=color HTML input type) we draw parallels with … the … Continue reading

Posted in eLearning, Event-Driven Programming, Tutorials | Tagged , , , , , , , , , , , , , , , , , , , , , , , , , | Leave a comment