Learn CSS layout by making a fake facebook page.
Update on my #teachtheweb fake facebook tutorial:
I will get CSS layout. I will get CSS layout…If I keep repeating it will it happen?
I got really close. I just can’t get my columns to float correctly. Click on remix to see the code. This is pretty much the first thing I ever wrote from scratch.
If you want to help me figure out my error. It will be appreciated.
Things left to do:
- Fix the layout of the second column. I have it set to float right but its appearing at the bottom of the other elements.
- Fix the color of the comment boxes. It is a slightly different blue. Never really cared about being color blind before. The only annoying thing was people asking ,me what color things are when they find out..but now that I am more of a webmaker it gets annoying. It is really hard for me to compare colors to hex charts. I try to use the inspect element but often the color is hidden in external style sheets. Somebody had the the idea of taking screenshot and then getting the color code in a photo program. I will try that. Still I wish there was an extenstion that let me right click on any element and get the color code.
- Add the CSS/HTML comments for teaching I know some don’t like all the comment clutter but my students find it helpful to have step by step instructions and definitions in the code.
- Make GIF tutorial Screencasting is so 2010. I am having better luck making a series of GIF clips.