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>

There are many instances when user input is needed. But allowing just any code to be passed can cause severe problems and lead to even the most annoying 10 year old script kiddie writing “PWND” all over website!

There a are some simple steps which you can take to prevent most of these.
This article will go over some of the fundamental XSS attacks and how to stop them.

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 »