Put colours inline

I'm trying to get these colours inline horizontal, but can't get it to work.
It should look likes this.

Hi,

You can use CSS to have it displayed to your liking. Here is a good start to get you going, and telling you how and where to apply custom CSS in HikaShop: www.hikashop.com/support/documentation/1...ize-the-display.html
Across the web are gazillions more tutorials and references for CSS coding.

More can't be said without seeing/inspecting the page, sorry.

Hey and thanks for the fast reply
her is a link to the page ^^
My site
My problem is that it is labels and they all have different names. And i need to use this characteristic in other products.
But I'm gonna try something.

First, you are using some "optimizer" (JCH?) on the site, so one can't see where exactly existing CSS etc on your site is coming from, and who knows what else it does. You should consider turning this off during site development.

Then, like so often, there are multiple ways to do this with CSS. Here is one example of code which you could try, it should work in your case and on this page. Just add it in a new line at the very end of a custom CSS file as described under the link I gave you:

@media (min-width: 980px) {
	.hikashop_product_right_part {
	    width: 322px;
	}
}
.hikashop_product_characteristics label {
    display: inline-block;
    margin-right: 16px;
    float: none !important;
}

Wow Thank you so much it works perfect
I tried to do something like that for each label id, but it would take a long time.
where did you find ".hikashop_product_characteristics label" and "@media"? i couldn't find something like that when using the inspector.
This is my first large project and I'm still in the learning process.
Btw I disabled JCH optimizer it didn't speed up my site anyway.
I'm gonna play around with this a little

The Doubter wrote: where did you find ".hikashop_product_characteristics label" and "@media"?

However, you have dropped a closing curly bracket "}" when copying my code.

So, please copy the code snippet from my post here above again and have it replacing your code at the end of your CSS file. Use the exact code, do not leave off any bracket!
If you prefer, you may still leave off the "margin-right: 16px," line, though. All the rest should stay as is, or things may display oddly...

Hey
Thanks for the help, now it makes sense
I wonder if something like browser prefix is supported because it is not identical between browsers.

Best regards
Martin

Forget it, I had to find the average width between browsers
Again thanks for the help