Margins are awesome

So the whole time I’ve been working on my current site, I’ve been wondering how the heck I was supposed to move my tables and lists to the appropriate spot on screen. Well fortunately today I learned about margins, and although I’m sure there’s another, even better way to do it, I’m happy to finally know how to place things on the page in some way.

The percent value option for the margin property was my biggest help here. I knew I wanted my text blocks and such on the right side of the screen, because I somehow finagled an awesome background picture that decided to have it’s most exciting part on the left hand side. At first I tried using the px option, but realized it’d be very difficult to get it directly in the middle, especially if the browser window changed. Thankfully, setting the margin to 50% did the trick. It looked something like this (only with way more css jammed in).

p

{

margin:50%;

}

The end result was that I finally have my first awful website almost done. I’m going to include a screenshot for now, but when I figure a way to host them for free I’ll post them online as well.

snowboard screenshot

Another cool thing I learned today is what a span tag is/does. I had been wondering for a while now, as I used one to do the outline you see in the “This website will…” section above. It seems that span tags are inline elements, meaning it can be used on a line between other elements. Div tags, however, are block elements, and appear on separate lines. This article did the best job of explaining it to me.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s