Adollo Blog

by Eric Rowell (cofounder of www.adollo.com)

I was working on Adollo today and realized that I was having problems centering a div element inside of another div where it was necessary to use the ”float:left” attribute, and having it look the same in IE7 and FireFox.  What a hassle!  After about half an hour of trying different things, I finally realized that I’d have to turn to Google, which wasn’t very much help either.  I even got out a web design book and starting reading about CSS!  If any of you have had this same problem, I thought I’d share the solution with you.

The problem with centering a div element is that you can only work with percents, and fixed values, and not a mix of both.  For example, if you wanted to center your web page which is inside a div tag of width 700 pixels, you would want to find the middle of the screen, and then position the div element to the left by 350 pixels.  Theoretically, it would look something like this:

margin-left: 50% – 350px;

Unfortunately, this isn’t possible with traditional CSS layout methods!  Luckily, there’s a slight-of-hand work around for this.  If we use absolute positioning, we can use the “left” attribute, and the margin-left attribute to represent both components of the theoretical margin-left.  This can be coded as follows:

position: absolute;
left: 50%;
margin-left: -350px;

And you’re done!  Hope this is helpful to someone!

by Eric Rowell (cofounder of www.adollo.com)

Many of you developers out there, including myself, may have been hearing about people developing their HTML layouts purely with CSS, instead of table structures, and asked yourself “Why? What’s the big deal?” You might even insist that table structures are just as good, and tell yourself that relearning HTML design with CSS is a waste of time. The truth is, it’s time to switch to CSS. Your pages will load faster, your html code will be about fivetimes shorter, the code itself will be more elegant, it’s easier to modify and manipulate HTML elements, AND your new pages will comply with W3C standards. Sound important now?

So you might be asking “OK, so when exactly do I use CSS, and when do I use tables?”  Generally, you want to use CSS for everything including positioning and styling, except when you are displaying data, like charts, or if you have grid-like web elements, such as forms.

I know alot of you might be hesitant to relearn HTML design, but it’s worth it. If you want to stay in the front of web technology, it’s time to throw away the tables, and start using CSS.