[Feb 1st, 2015] I’ve finally updated my code examples for the very popular seriesÂ I’ve shared with how to center content within a section that has a “full width” (or “full bleed”) background (100% Full Width Header & Footer with Centered Content series: v1v2v3Â – disregard all of those now!).
Edit 2/27/2012: I’ve updated the files to include a fix for links not being clickable in the header as well as an option to have the footer anchored to the bottom of the page! :D
This is a project I’ve been working on over a few years. I introduced my first solution back in 2008. It worked, but had some limitations. After recieving feedback and comments I once again offered another solution in May 2011 that worked great… at first. After testing myself, and reading more feedback and comments I’ve come across another limitation. When you downsize your browser window enough to require a horizontal scroll a curious thing happened. Scroll over to the right edge of the screen the header and footer no longer stretched 100% across the screen.
When you work on a new web design project and have entered the stage for coding, how do you go about it?
Do you start with the HTML and write the whole HTML page first, then code your CSS then troubleshoot?
Do you write all of your CSS first, then the HTML markup, then troubleshoot?
Or, do you write chunks of HTML first, add in the styles, troubleshoot/test, repeat?
Personally, I have done it just about all three ways – but my most often used method is the 3rd. I start from the top and work down to the bottom from left to right. I will start and code the entire header of a site in HTML first – then write my styles. Check in firefox, and repeat. Then, after the whole page is completed I check in all browsers to trouble shoot compatability issues – which are usually minimal and related to IE6 only – go figure!
In the beginning of 2006 I launched CSSgirl. I moved all the content from my old site (triplelproductions.com) and started CSSgirl Designs with a brand new design. Over time I’ve changed the design a bit, adding and removing sections, images and content.
Since last summer I’ve been planning a redesign, but I just can’t settle on one that I am happy with. So, I would like to have some feedback from the people who visit my site- who see it regularly!
I have four designs that I’ve created that I am deciding between. View them and let me know your opinions – good or bad! Two have already been coded, two are just image mockups:
(PS: If you vote for “something else entirely”, let me know WHY. otherwise I’m going to remove that choice because I won’t know which direction people are looking for! Your comments won’t hurt my feelings, I promise!)
What Design Should I Run With?
Dark Rainbow (27%, 20 Votes)
Whiteboard (26%, 19 Votes)
Watermelon (20%, 15 Votes)
Super Serious Dark (8%, 6 Votes)
Leave it! (7%, 5 Votes)
Use the current design, just make it better. (7%, 5 Votes)
Something else ENTIRELY! (5%, 4 Votes)
Total Voters: 74
Voting ends September 1st, 2008.
The three designs I do not choose will be converted into free WordPress themes (and Movable Type too, if I find the time!) :)
Please leave comments with suggestions, criticisms, etc!