rarebit Posted January 3, 2009 Share Posted January 3, 2009 Hi, I'm after putting a colour swatch within a combo, but it's eluding me. I can change the individual colours of the text, add images, but not a little swatch. <select name='bg_col'> <option value='#3cb878' selected><div style='width:5px;height:5px;background-color:#3cb878;'>X</div>#3cb878</option> <option value='#4b0049'><div style='width:5px; height:5px; background-color:#4b0049;'>X</div>#4b0049</option> <option value='#000000'><div style='width:5px; height:5px; background-color:#000000;'>X</div>#000000</option> <option value='#ffffff'><div style='width:5px; height:5px; background-color:#ffffff;'>X</div>#ffffff</option> </select> Cheers for any solutions... Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/ Share on other sites More sharing options...
bubbasheeko Posted January 3, 2009 Share Posted January 3, 2009 Hi rarebit, You can apply it to the whole "row" just not the letter X. You would incorporate the swatch via an id or class tag on the option tag. Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-728936 Share on other sites More sharing options...
rarebit Posted January 3, 2009 Author Share Posted January 3, 2009 I'm not wanting to do the whole row because i'd then have to arrange a contrasting colour for the text to be prominent. Also when I said swatch I was not inferring the full background just a small portion to the side of the text. Cheers Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-728941 Share on other sites More sharing options...
DamienRoche Posted January 4, 2009 Share Posted January 4, 2009 background:#fff; will suffice - you don't need to use background-color. From what I know you are not getting any results because you are limited by the select and option tags. You're not able to style certain elements or elements within certain elements. The only way around it is to have the swatches external of the option tags. Hope that helps. Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-729035 Share on other sites More sharing options...
bubbasheeko Posted January 4, 2009 Share Posted January 4, 2009 I agree, if you use Dreamweaver it does not color the div tag as being valid when it is contained with an option tag. Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-729057 Share on other sites More sharing options...
rarebit Posted January 4, 2009 Author Share Posted January 4, 2009 Yep, i'm getting defeated, tried spans, fonts, divs, the lot... i'll see if I think of a fresh approach tomorrow... Cheers! Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-729065 Share on other sites More sharing options...
bubbasheeko Posted January 4, 2009 Share Posted January 4, 2009 Ya sorry I couldn't give you any more help than that Maybe I will find something relevant tonight. Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-729075 Share on other sites More sharing options...
dropfaith Posted January 4, 2009 Share Posted January 4, 2009 you could do some js and have a small image change when hovering links or onclick id look into that cuase option css sucks Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-729136 Share on other sites More sharing options...
rarebit Posted January 4, 2009 Author Share Posted January 4, 2009 I always need a non js method first! Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-729140 Share on other sites More sharing options...
bubbasheeko Posted January 4, 2009 Share Posted January 4, 2009 Hey rarebit I did have a thought about what you are trying to attempt. I haven't tested it myself yet...but here we go. You know if the small bit of text on the left was the same size you could create a background image for each option and utilize a class or id on the option tag while still accomplishing what you want. Downside: If the width varies...well you get the picture. So something like this can still work: .option1 { background-image: images/image1.jpg; other css } .option2 { background-image: images/image2.jpg; other css } .... <select> <option class="option1">Test 1</option> <option class="option2">Test 2</option> </select> Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-729171 Share on other sites More sharing options...
rarebit Posted January 4, 2009 Author Share Posted January 4, 2009 I can already do images. I have a single class and then use inline styles to override the image. Cheers though! Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-729173 Share on other sites More sharing options...
bubbasheeko Posted January 4, 2009 Share Posted January 4, 2009 Hey...I'm trying lol Then again I thought I would be sleeping by now...damn over active brain Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-729178 Share on other sites More sharing options...
rarebit Posted January 4, 2009 Author Share Posted January 4, 2009 me too, just twittering away... Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-729179 Share on other sites More sharing options...
bubbasheeko Posted January 5, 2009 Share Posted January 5, 2009 Back at it I see...I never did find anything else that could help I really tried. Link to comment https://forums.phpfreaks.com/topic/139362-colour-selection/#findComment-729649 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.