If the radio-buton and content are two element in sibling tag/have the same parent, I can use combinator "~" or if it is next o eachothers, I can use "+" to combine those element as a selector, so if any radio-"n" is checked the code inside"{}"is working in content-"n" element (it show&transite to conten-"n") like this:

As you stated correctly the radio button (which actually is a text input in your example as both the type radio and name are missing) are (far) out of scope for CSS selectors alone.

So you're pretty much obligated to use javascript if the HTML should remain the same.

One simple way is to make sure both to have event handlers on the radio buttons and listen for changes (in selection).

working fiddle demonstrating this. (Note that I have taken the liberty to reduce the amount of id attributes in the HTML and added the type and name properties to the <input> elements

It is however possible to solve this without the use of javascript, though it will require your HTML to change (slightly, but still). The trick is to ensure the radio buttons to be somewhere above or at the level where both the tabs and their contents reside.

The trick is to use (or abuse) the option to have labels refer to input element anywhere on the page and to hide the radio buttons.

The primary change in your HTML would be to move up the radio buttons high enough to allow 'reaching' both the tabs and the contents from there (given you structure this would be before the tabs as direct child of the body)

Email codedump link for HOW to combine two element that has different parent in CSS?