CoreyMade » Tutorials

Working with height in CSS

Corey — Thu, 12 Nov 2009 20:00:12 +0000

Hey everyone, I know it has been a while from my last post, and I know I am severely slacking on the “Building a Personal Brand” series. No, there is not really a logical excuse for this madness, just swamped with client work at the moment, which is always a good thing for any business, but freelancers especially. So what is the reason behind this post? Well the other day I was working on a client site and was attempting to have a height on a sidebar that extended from the top of the containing div to the bottom. I, like most people figured well I will just give the div class that I want to extend a 100% height such as this:

.myclass {height:100%;}

This really didn’t work out too well because it didn’t do anything. The height was the same as it was before I added the code. Why is that? I spent a while researching it through my CSS books and then went to google to find a quick answer. What I found makes perfect sense, but I will be honest, I never thought about doing it. With talks with some friends and a quick google search, I learned that the containing div class needs to have a height set of 100%. So the HTML would look something like this:

expanded box content

and the css for this would look something like this:

.mycontainer {min-height:100%;}
.myclass {min-height:100%;}

So the lesson of this post, is to ensure that if you are indeed looking to make a container expand the entire width of the page you need to give the div you want to expand a height of 100% PLUS the containing div a 100% height also. I would like the people that helped me understand this. I can’t believe something that simple was so annoying. Oh well, lesson learned!

Screencast: Realistic Shadows Using Fireworks CS4

Corey — Thu, 15 Oct 2009 01:00:11 +0000

Hey guys, this is my first screencast with the new design but it is one that I have touched on before. However, I seemed to have lost the old video so I redid the screencast. This is my first screencast using Screenr, so let me know how you guys like the quality and sound, but also chime in on the actual screencast information. This is a very simple tutorial but they will get more and more advanced, I promise.

The new CoreyMade is finally alive

Corey — Fri, 09 Oct 2009 20:54:12 +0000

Hello everyone and welcome to the all new CoreyMade web site. It has been a very long time that my site has been out of commission due to lack of backups, coffee and extreme client work. However, today is the official launch of the all new brand. I have decided on making the site more professional, and sleek. If you recall the other site was good, but in retrospect was just not working out for me. As you can see I have a whole new look from the logo, to the journal that you are reading now. I get asked a lot why I always change my site design. It’s actually quite simple. I get tired of things really quickly. However, with this design I have vowed to keep it and update it as much as possible with new portfolio entires, interesting journals and useful screencasts. I hope everyone likes the new design as it took a long time to get things put together. However, as the old saying goes, hard work pays off at end of the day. Here are some changes that I have done

General Layout:
The layout is completely different from previous versions of CoreyMade. In older versions, I used a lot of vector such as my last live site was compromised mainly of vector graphics. This current design as you can see, steers away from the vector based graphics. I have tried to keep the layout as simple and clean as I could while staying focused on my brand!

Phases:
In previous versions of CoreyMade, I did not list my phases that I do from start to finish on design projects. However, I thought it is an important aspect that clients would like to know how I handle things from the moment I start on a project. I have also limited what services I offer and stick typically to web design and compliant code.

Portfolio:
I have limited my portfolio entires by quite a bit, only listing nine different case studies at a time. I gave this much thought, and the final conclusion was I wanted to list my best web designs, and provide actual history and outcome to each. In previous versions of CoreyMade, I did not infact have what the project was about or how it ended. As you will see in this version of CoreyMade, I have expressed the client project in detail.

Well thats about it folks, I hope you enjoy the new site and please leave comments!