Hi!

HTML & CSS
1

What selector can be used to when one radio button styles changed to another. I connected the input i label, styles can now write for the label
This selector sets the style of the current label, but it is necessary that they bear the label adjacent

input[type=radio]:checked + label

I want to do it on css3

 <input id="n1" type="radio" name="p01-contact_fields[5]" value=" &#1052;&#1091;&#1078;&#1095;&#1080;&#1085;&#1072;">
                    <label for="n1"> &#1052;&#1091;&#1078;&#1095;&#1080;&#1085;&#1072;</label>
                    <input id="n2" type="radio" name="p01-contact_fields[5]" value=" &#1046;&#1077;&#1085;&#1097;&#1080;&#1085;&#1072;">
                    <label for="n2"> &#1046;&#1077;&#1085;&#1097;&#1080;&#1085;&#1072;</label></div>

For example, as here, only horizontal button switch
http://tympanus.net/Tutorials/CSS3ButtonSwitches/index2.html

2

but it is necessary that they bear the label adjacent

Hi, welcome to Sitepoint and sorry we missed you post :slight_smile:

You have to use the adjacent selector because that’s the way to select something based on a separate elements condition.

You can also using the general sibling selector to select all siblings but generally you want to select the next element from the checkbox and then perform styling on that element.

If you wantedt to stylemore than one element then you could putr the elements inside a div and target them that way.

e.g.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style>
.error { display:none }
input[type=radio]:checked + div {
	background:#f9f9f9;
	padding:10px;
}
input[type=radio]:checked + div .error {
	color:red;
	font-weight:bold;
	display:block
}
</style>
</head>

<body>
<input id="n1" type="radio" name="p01-contact_fields[5]" value=" &#1052;&#1091;&#1078;&#1095;&#1080;&#1085;&#1072;">
<div>
<label for="n1"> &#1052;&#1091;&#1078;&#1095;&#1080;&#1085;&#1072;</label>
<span class="error">Warning You have selected this</span>
<div>
</body>
</html>

It might help if we knew what the problem was that you were having and what you wanted to style?