Stupid Squidoo CSS Tricks - Side Bars

1 - I can do better 2 - Jury's out 3 - Pretty darn good 4 - Splendiferous 5 - Awesometastic by 5 people | Log in to rate

Ranked #12,959 in How-To, #136,300 overall

Making a Side Bar in Squidoo

If you liked my last Stupid Squidoo Trick, you might like this one. Here I attempt to make a floating side bar for your lens.

Using css to float a sidebar 

This is a floating block. It should appear on the left hand side with a light yellow background.

Making a floating side bar is easy enough. You need to enter a <p> tag and fool your browser into thinking it's a box. You figure the width and height and the add the float:left style to it. You can also float right if you like.

The HTML stuff is touchy so copy it exactly. Every quote, colon and semicolon must be in the right place.

Here's the HTML code to make it work:

<p style="background-color:lightyellow;display:block;float: left;width:120px;height:400px;">
contents go here
</p>

I made a list of the color names in my last Stupid Squidoo Tricks where I figured out that Squidoo lets you do this stuff.

CSS books on Amazon 

CSS: The Missing Manual

Amazon Price: $23.09 (as of 12/21/2009) Buy Now

CSS Mastery: Advanced Web Standards Solutions, Second Edition

Amazon Price: $26.39 (as of 12/21/2009) Buy Now

HTML, XHTML, and CSS, Sixth Edition

Amazon Price: $23.09 (as of 12/21/2009) Buy Now

Head First HTML with CSS & XHTML

Amazon Price: $26.39 (as of 12/21/2009) Buy Now

CSS Pocket Reference: Visual Presentation for the Web (Pocket Reference (O'Reilly))

Amazon Price: $9.99 (as of 12/21/2009) Buy Now

Suggestions 

Give me some ideas about things that you would like to do with CSS on Squidoo.

submit

by KPGraham

Born in North Carolina and raised in New York. Married 34 years. I own too many damn cats.
(more)

Explore related pages

Create a Lens!