Welcome to Alternate Gateways

Welcome to Alternate Gateways — the homepage of web developer, CSS aficionado and writer Helen Meyer. The aim of this site is to showcase my work, and provide comprehensible tutorials on CSS and (X)HTML.

CSS tutorials, including (X)HTML...with a little JavaScript, Java and MySQL thrown in!

If you're looking to learn CSS or you already know it but want to refine your skills or learn something new, why not check out my CSS tutorials?

For those new to the game, there are tutorials which cover the basics of CSS and provide demonstrations of useful stuff you might want to do. An example of this is my long-running series, CSS 101 - A Beginner's Guide to CSS, which provides complete yet easy to understand information on CSS. The aim of these tutorials is to teach you about CSS and how to use it properly to build standard compliant websites.

For those already familiar with CSS and (X)HTML, I'll show you how to accomplish complex tasks, without the complex code. Check out the Intermediate and Advanced Section for more on this. There is also the CSS SOS section, which provides solutions for common CSS problems.

I also write the odd article about XHTML, and will occasionally write a tutorial for MySQL, JavaScript and Java. All of this stuff can be found in the resources section.

A little about me

I am a web developer, and have worked in the field for several years. I specialising in CSS, XHTML and web standards, as well as PHP programming, in conjunction with MySQL. I'm a big fan of writing, and in my spare time I write fiction, mainly of the young adult or supernatural genre.

If you've landed here by accident, why not take a look around...you might see something you like!

Latest News

25aug

CSS 101 | Part Twelve - Borders in CSS...and more

Part Twelve of the CSS 101 - A Beginner's Guide to CSS series is now available. It is titled "Borders in CSS" and, as the title dictates, explains how to create borders with CSS. There are examples of the various border styles, information regarding which units of measurement and colour values to use, and demonstration of common usages of borders in CSS.

I have also created a CSS Reference section, which provides a quick view for CSS poperties and (X)HTML tags. If you want to know more about a certain CSS property or (X)HTML tag, just click the corresponding link and useage information will be displayed. More tags and CSS properties will be displayed over time.

Lastly, I've been asked a few times why I title my HTML code examples "(X)HTML Code" and not just "HTML Code". This is because the examples contain tags included in both XHTML and HTML. Given some people prefer XHTML and others HTML, it makes sense to title the examples in a manner that makes both parties happy. There's no discrimination here!

03aug

More mass updates

Earlier on in the week, I wrote a new instalment for the CSS 101 - A Beginner's Guide to CSS, entitled CSS and Headings, which explains how to style headings with CSS and some info on how to use the heading tags and how not to use them.

I must apologise for the slow updates to the CSS 101 series, of late. I've been preoccupied with other tutorials which have been on the back-burner for some time, as well as an e-commerce project...and a long-term relationship which shouldn't come second to my laptop! I have several more instalments lined up for CSS 101 series, ranging from CSS columns to visibility in CSS, so check back for those soon.

Over the weekend, I finished changing the syntax highlighter in the resources section, so all the code samples now look a hell of a lot better. I also updated and generally modernised several more of the tutorials — too many for me to list here without getting serious RSI!

27jul

Major Updates

This week has been a busy one. I've written three new tutorials and updated one. Two of the new tutorials are for the CSS SOS section. The first deals with empty elements that vanish because they don't have dimensions, and the second is on odd absolute positioning errors.

The third tutorial is for the Intermediate and Advanced section and one I've been meaning to write for a while, because it concerns a question I get asked a lot. The tutorial is rather aptly called How to make an element stretch to fit its contents and — as you've probably guessed — explains how to make an element expand to fit whatever is inside it. How to make an element stretch to fit its contents can be found here.

I've also updated The top 10 things you've always wanted to do in CSS to include some useful links and clearer descriptions, in places. It was the first tutorial I wrote so it is getting on a bit!

21jul

CSS SOS

I've created a new CSS section called CSS SOS, which deals with annoying things that can go wrong in CSS and demonstrates how to fix them. There's two tutorials there now, one on that annoying issue with content that overlaps for no seemingly plausible explanation, and another on the infamous float leakage.

There is also a Basic How-to's section, which demonstrates simple tasks, such as removing the outline from a link.

08jul

Two new turorials and two updates

The next instalment of the CSS 101 series, Part Ten - Backgrounds in CSS is now up. It explains everything you need to know about backgrounds in CSS and provides in depth examples into the various CSS background properties and how to use them.

There's also an Intermediate to Advanced tutorial which explains how to tackle a common problem involving column layouts and positioning an image in one column so that it lines up the text in the bottom of another column. This tutorial is aptly titled Columns and background images that line up with the bottom of text and can be found here. I haven't written anything new for the Intermediate to Advanced sections for a while, so it was a refreshing change.

I felt that the CSS 101 | Part Five - The Document Tree tutorial lacked because it didn't provide actual explanations of the various elements within the document tree, so this has now been rectified. I have updated this tutorial with a full explanation of the document tree's constituents and how they relate to one another.

The second update was to Horizontal menus and list items with definite widths. As I've mentioned, I'm working my way through my old tutorials modernising them and adding a better code box. Horizontal menus and list items with definite widths was the next tutorial to get this treatment. It now has more examples and more explanation on how to create horizontal menus with list items that have definite widths. Plus it now has a colourful code box round all the code examples!

09jun

CSS 101 | Part Nine - CSS and Links

Part Nine of the CSS 101 series is now available: CSS 101 | Part Nine - CSS and Links, which demonstrates how to style links with CSS, along with plenty of varied examples and useful techniques. I also cover issues with applying classes to links and -- although it's not strictly CSS - useful link attributes. Check it out here.

08jun

My Contact Form

I just realised my contact form hasn't been sending messages for...well, I don't know how long for. Probably the end of October 2009. It looks like it sends the message, when, in fact, it doesn't. Normally I get more emails from the contact form than to helen@alternategateways.com, and I was wondering why that had suddenly dropped! The problem is fixed now. I'm really sorry if you've emailed me and not had a response because of my stupidity! If you haven't labelled me as "uncaring and never writes back" please feel free to email me again, and I will endeavour to respond as soon as possible ;).

On another note, I will be writing more additions to the CSS 101 series (in fact, I'm doing it right now). So check back for the first of those (which is on CSS and links) by the end of the week.

I will also continue to update and generally modernise my other tutorials.

Older News

27apr

CSS 101 updates and more

I've added more instalments to the CSS 101 series. There's Part Three, which deals with how to apply CSS; Part Four, which discuses the CSS order of precedence; Part Five explains the Document Tree; Part Six lists the CSS units of measurement; Part Seven shows how to apply CSS to paragraphs. Lastly, Part Eight demonstrates how to style text with CSS - such as making text bold or italic, changing the colour and font family and aligning text.

I've also updated the tutorial on creating horizontal menus with automatic widths. It is now packed with information on how to create a horizontal menu with list items that have automatic widths, as well as plenty of examples.

01apr

April Fools! No more updates

Not really. Well, after several turbulent months of my site continuously being down, I have finally managed to move hosts, and the glitches and downtime should now be a distant memory. I have been with my new hosts before, for several years, and they're really good, so I'm going to put the last several nightmarish months behind me.

As I transferred my domain to my new hosts, everything was down for seven days. I took this time to update some tutorials, and also write the third instalment in the CSS 101 series. Part three deals with how to apply CSS to elements on a web page and can be accessed here.

The tutorials I updated are as follows:

The Fonts tutorial has been updated as certain sections were out of date. The Form Part One and Form Part Two tutorials have been completely re-written and also include the attribute selector, and the Top Ten tutorial contains an updated section on floating and clearing. I'm also working my way through the tutorials replacing my blocky code styles with a JavaScript syntax highlighter.

06mar

Tutorial Updates

I've finally written some brand new CSS tutorials! I know, it's been ages since I've written a CSS tutorial. The first is called How to override styles and use of !important, which demonstrates how to override styles, what to do with styles that clash, and how to use the CSS keyword !important. It's important to know how to override the styles of one rule with styles from another, as this does crop up every now and then. This tutorial can be found here.

I have also begun a series of tutorials on the basics of CSS. It struck me that I've never written a beginner's CSS guide for Alternate Gateways. I actually thought I had - how could I not, I'm a CSS fanatic! - but apparently not. This had to be rectified.

The series is called CSS 101. So far, there are two instalments - CSS 101 | Part One - Laying the foundations and CSS 101 | Part Two - The Selectors. There will be plenty more, detailing everything you need to know about CSS. If you are a beginner, you won't be for very long. I am adding to the series on a regular basis, so check back frequently ;)

07feb

Site Updates

I've updated several tutorials, which I felt were getting a bit outdated: The CSS way to style forms | Part One and Part Two and How to eliminate unnecessary tags using the CSS clear property. These are now shiny and new and ready for you to view!

I've also added social network bookmarks to my tutorials, so if you see something you like, please feel free to share it ;).

19jan

MySQL statements you might want to know

I wrote a little document on some differences between MySQL and Oracle, so I didn't use the wrong syntax, and decided to expand on this and make it into a guide. The guide explains how to do some useful stuff in MySQL like print out to a file and select the top n rows, etc. There's also some basic stuff in there about altering columns and deleting rows. You can find the Useful MySQL guide here.

16oct

Long overdue updates!

It's been several months since I've done anything on Alternate Gateways. I've been busy with writing, and working on other websites (as well as my soon-to-be-live blog!!), that I haven't had time for my once frequently updated Alternate Gateways.

The first in my string of updates are a couple of tutorials on horizontal menus, explaining how to create menus with list items that contain automatic widths, and definite widths. I'm also writing an SQL tutorial and some more HTML/CSS tutorials, so watch this space!

01apr

Tutorial on how to use the CSS clear property to eliminate unnecessary code

I decided to write a tutorial about using the CSS clear property to save time and code, because I find it really useful, and, when used properly, it will cut down on your coding. This tutorial can be found here.

23mar

Tutorial on how to make headers for fluid layouts

It's been a while since I have written anything for this site, so apologies for that! Deciding to get back into the web design swing of things, I wrote a tutorial on how to create headers for fluid layout sites. I've heard people saying that they feel they must simplify their headers just because they're dealing with an unknown width, but this isn't the case. You can still create flashy or complex headers for fluid width sites. I have addressed how to do this in How to create a header for a fluid layout.

20dec

XHTML 2 Tutorial

With more people talking about XHTML 2 I decided to write an article about what's new in XHTML 2 - so here it is.

26nov

London Marathon 2009

A client of mine (Gary Eccleston from Cloud9Craft) is taking part in the 2009 London Marathon and has kindly asked me to place a link on my site enabling people sponsor him. His chosen charity is WellChild, which supports sick children and their families.

Click here for more information, or to make a donation.

5oct

PNG Transparency Tutorial

Wrote a tutorial on how to achieve PNG transparency in IE6. Why do I care about IE6? Well, I don't, but people still use it, so, as much as I'd like to ditch it, I can't. I'm counting down the days until we can wave a permanent goodbye to Internet Explorer 6 and forget that it ever existed!

19jul

Styling List Items

Added another CSS tutorial, this time on styling list items, which you can find here. It describes how to change a bullet point, positioning bullet points, swapping bullet points with images and applying a background-image to an list item.

16jul

All about CSS Transparency

Added a tutorial on CSS Transparency, which you can find here, as I felt there wasn't enough clear, concise information out there about transparency in CSS.