Page 1 of 1

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

Posted: Thu Oct 26, 2006 7:07 pm
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. :)

Posted: Thu Oct 26, 2006 7:31 pm
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>

Posted: Thu Oct 26, 2006 7:40 pm
by Luke
thanks man... that works much better. (I actually had just implemented exactly that right before you posted hehe)