Putting W3CSS into Your WordPress Pages

W3Schools W3CSS is a robust CSS Framework for use in WordPress The following examples show some of the advantages of having a mobile/responsive CSS Framework available to your WP editing. It is like having BootStrap or Foundation Zurb at your disposal. The styling in W3CSS is easy to learn especially if you have used either […]

EnjoyCSS: Online CSS Testbed & Tutorial

The Opensourcery has already featured  the wealth of online Web coding websites like CodePen, JSFiddle, SQLFiddle among others. Although CodePen and JSFiddle have edit windows for CSS, HTML and JavaScript, they provide few aids in writing correct CSS, HTML or JavaSCript code – its users DIY. In contrast EnjoyCSS only has HTML and CSS windows but […]

Smart Slider 3: Best New Free WordPress Slider

For the past year I have been recommending Cyclone Slider 2 as the best free WordPress Slider. But that has changed with the free version of Smart  Slider 3 contending for the top spot of free WordPress sliders. As we shall see the  two sliders are evenly matched so slight differences in features, ease of use, and […]

Web BandAids

Over the past 5 years the aids to using HTML5 and other key Web tools have accumulated rapidly. And the need for advice when and how to use features in Web tools has not abated. First there is the continuing rapid release of new features as mobiles and the IoT-Internet of Things bring new demands on […]

Site Origins CSS Editor

SiteOrigin already has a solid 5 star, 500K downloads hit with its free Page Builder WordPress plugin – and it may have topped that with its new SiteOrigin CSS Editor. This is a CSS editor for beginners and advanced users with  2 modes of operation – easy Point & Click CSS edits and Advanced full […]

InK – Interface Kit: Responsive, Mobile JS Framework

In our sister publication, JavaScriptures, we have reviewed two JS Responsive/Mobile Frameworks – Bootstrap 3.2 and Foundation 5.3.2. And broadly, the reviews have been positive because both frameworks deliver 12 column grids which help to deliver responsive designs with sticky menus and a core of basic JavaScript UI components. Both Web designers and developers will […]

CSS Border Styles

It is hard to remember the CSS border styles so with some help from W3schools, creating a demo of the available border styles is easy as pie. But in the process, Border style turns out to be handy for providing alternative link decorations as shown below: [iframe src=’http://theopensourcery.ca/Scripts/cssborderstyles.html’ width=’620′ height=’380′] Now the tricks here are […]

CSS3Maker for Free Online CSS Code Generation

The traditional CSS tools may be behind in implementation of the CSS3 standards; but online there are nearly a dozen good and free  tools for implementing CSS3. Already we have noted the utility of CSSmatic. Another robust free online CSS3 Generator tool is CSS3Maker. CSS3Maker for Animations The code generation tool for Animations is quite […]

Abandonment of Styling Options in HTML5

As the table below shows, HTML5 is abandoning many of the styling options of the TABLE command: Attribute Value Description >align left center right Not supported in HTML5. Specifies the alignment of a table according to surrounding text bgcolor rgb(x,x,x) #xxxxxx colorname Not supported in HTML5. Specifies the background color for a table border 1 […]

D3JS & the SVG Web Advantage

SVG is gaining in popularity and therefore broader usage. And why not? Scalable Vector Graphics have a number of factors working for them: 1)As vector graphics, SVGs zoom, scale and generally transform with greater fidelity than bitmaps, even high quality PNG and TIF bitmap file formats; 2)SVG file formats generally are smaller in size to […]

Dropcaps CSS

Dropcaps in CSS are always “fun” to do for 3 reasons. First, the CSS seems easy enough to do. Use a float styling in a SPAN. Or use a :first-line:first:letter pseudo-class to style not just the first letter but also the first line of text as well. The second reason dropcaps are “fun”is because then you […]

CSS3: More Triggers

CSS3 has unleashed the animation and active transformation capabilities of CSS in general. But much of this CSS should have been available 10 years ago if web browser vendors had been more prompt and uniform in their simple CSS standards implementation [think a very delinquent Microsoft IE even after a second promise from BIll Gates […]

CSS3 Online Generators

Like Rodney Dangerfield, CSS3 gets no respect – not only have the various browser vendors been slow in implementaion; but many are also imposing their own bizarre prefacing like -webkit-box-shadow: and -moz-box-shadow: etc. To add insult to injury, the traditional CSS Styling programs like Top Style and StyleMaster have also been tardy in their implementation of […]

Buttons Flexing Their 3D Muscles

3D Transformations are applied here in CSS3 to buttons in muscular fashion. But the CSS3 3D coding is truly long and garrulous [think error prone]. Thus the attraction of CSS preprocessors like LESS and SCSS. [iframe width=”100%” height=”550″ src=”http://takethe5th.ca” allowfullscreen=”allowfullscreen” frameborder=”0″] So LESS available in the Codepen test environ was applied to the Buttons with […]

CodePen Canvas Example

Here is another opportunity to show an online HTML/CSS/JavaScript environ in action – CodePen. In this case a Canvas example using the wirelib() library of 3D routines is highlighted: [iframe src=”http://codepen.io/jbsurveyer/pen/rKDkF” width=”100%” height=”550″] More about Wirelib can be found here.