Three colors in CSS - advice (image in thread, but not big)

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
Luke
The Ninja Space Mod
Posts: 6424
Joined: Fri Aug 05, 2005 1:53 pm
Location: Paradise, CA

Three colors in CSS - advice (image in thread, but not big)

Post by Luke »

I have a layout that will need to change colors depending what season it is, and I'm going to just set up a php script that will act as the css file. Then change out the colors automatically depending on the date. My question is this... what would be the best way to go about creating something like this:
Image
See the bar with the three colors? What would you guys suggest I do to display that all in css? I've tried this method...

Code: Select all

<div><ul id="color_bar_top"><li class="color_one"></li><li class="color_two"></li><li class="color_three"></li></ul></div>
and it worked ok, but it acted a little strange when you changed the window size... it's not the biggest deal in the world, but I just thought I'd ask. Thanks guys. :)
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Post by RobertGonzalez »

Code: Select all

#row-wrapper {
    margin: 0;
    padding: 0;
    text-align: center;
}

#col-left {
    float: left;
    background-color: #ff0000;
    width: 33%;
}

#col-mid {
    float: left;
    background-color: #00ff00;
    width: 33%;
}

#col-right {
    float: left;
    background-color: #0000ff;
    width: 33%;
}

Code: Select all

<html>
<body>
<div id="row-wrapper">
    <div id="col-left">1</div>
    <div id="col-mid">2</div>
    <div id="col-right">3</div>
</div>
</body>
</html>
User avatar
Luke
The Ninja Space Mod
Posts: 6424
Joined: Fri Aug 05, 2005 1:53 pm
Location: Paradise, CA

Post by Luke »

thanks man... that works much better. (I actually had just implemented exactly that right before you posted hehe)
Post Reply