Abeon Tech

I often get asked how to properly align divs and containers on website pages.
The most common bugbear is centering divs either vertically and horizontally, which can be a pain unless you know how.
This post has three examples of how to position the divs and should help clear up any confusion you may have.

Text is simple to align with css using the “text-align” property, as below:

// CSS
.positionme { text-align:center }
 
// HTML
<div class="positionme">
Position Me!
</div>

Positioning a div to center vertically and horizontally is a little trickier, but easy when you know how!
Let’s start with centering the div horizontally:

// CSS
.positionme { text-align:center; width:250px; margin:auto auto }
 
// HTML
<div class="positionme">
Position Me!
</div>

We can use a similar trick to get the div positioned centered vertically too:

// CSS
.positionme { text-align:center; width:250px;height:250px; 
       left:50%; top:50%;
       margin:-125px 0 0 -125px;
 }
 
// HTML
<div class="positionme">
Position Me!
</div>

AVElf is a free template for the AV Arcade game site script (v4.0.1)

AVElf is a little different from other AV Arcade Templates I’ve seen, and has been modified a lot.

The flash arcade skin it totally free. All I require you leave the link in the footer.

I have moved the locations of the Featured Games and News modules so they fit into the template better.
I have also SEO and Adsense Optimized this template a little, including keywords hear the header more text on pages and so on.

More »

With CSS all you need to do is put a piece of code in your style sheet to automagically make image or text rollovers.
You don’t need a second image or messy scripting.

More »