Comparison of Font Sizes

I wanted a comparison between the different pixel and point sizes. I’ve listed the increasing numerical size for each series side-by-side, illustrating how points get progressively larger. In the table below I’ve set the style in the pixel and point columns such that it’ll over-ride the CSS configured elsewhere.   […]

Creating Content Border with Images

Website content blocks, often called modules, or widgets, can be surrounded by borders to make them stand out. Perhaps notepad paper or an old parchment. Different surrounds and backgrounds can be used to make the content pleasing to the eye and to add distinction. The styling enables the content to be […]

Change Colour of Text Underline

Looking to set the underline colour of text to be a different colour to the text. The default colouring will set the underline colour to be the same as the text, as illustrated below: Example text with an underlined word. We can use CSS for setting the colour using the […]

Adding ClearFix Clear Float after div

I was interested in clearing floats and adding clearfix after a section of content. Working on a website theme I was integrating the output from a plugin. The plugin had a wrapper div with a series of entries each in a div. Shown below is the wrapper div with the […]

Change the Horizontal Line Colour in WordPress

On a WordPress website I added a horizontal line to divide two sections of content. Within the WordPress editor I had added a horizontal line to space some text. Providing a divider between two sections of text on the web page. To add the line I had used the HTML […]

Don’t Inherit parent CSS opacity

In CSS once a parent element has its opacity set, the child elements inherit the same value. This can render the child elements progressively more difficult to view. But, now there are ways to prevent CSS child elements from adopting their parent’s setting. When setting a CSS opacity on a […]

Add Quotes Around Text With CSS

Add quotation marks around a testimonial text using CSS, not in the testimonial entry. Instead of adding quotation marks within the quoted text why not add them automatically using CSS? For a WordPress website I had included a testimonials plugin. The plugin had a number of text fields. Wishing to […]

CSS Import

Using @import a second CSS stylesheet can be included as a reference from a CSS file. An example of this referencing is shown below where the file stylesheetB.css has been referenced using @import. @import url(“stylesheetB.css”); @import should be added to the head of the CSS file. Adding an import of […]

JQuery Accordion with Different Header Colours

The JQuery Accordion is configured, by default, to have one colour style for the inactive headers and another for the active one. CSS can be used to give each header a different colour. Using the CSS3 child numbering for elements different colour schemes can be assigned to each of the […]