JSFiddle - React, Tailwind, and code Playground
HTML
<div id="questionAnswerRadio">
<label for="r_starkeAblehnung" class="css-label">
<input type="radio" id="r_starkeAblehnung" value="StarkeAblehnung" name="radio" class="css-checkbox"> <span>Starke Ablehnung</span>
</label>
<label for="r_ablehnung" class="css-label">
<input type="radio" id="r_ablehnung" value="Ablehnung" name="radio" class="css-checkbox"> <span>Ablehnung</span>
</label>
<label for="r_neutral" class="css-label">
<input type="radio" id="r_neutral" value="Neutral" name="radio" class="css-checkbox"> <span>Neutral</span>
</label>
<label for="r_zustimmung" class="css-label">
<input type="radio" id="r_zustimmung" value="Zustimmung" name="radio" class="css-checkbox"> <span>Zustimmung</span>
</label>
<label for="r_starkeZustimmung" class="css-label">
<input type="radio" id="r_starkeZustimmung" value="StarkeZustimmung" name="radio" class="css-checkbox"> <span>Starke Zustimmung</span>
</label>
</div>
CSS
#questionAnswerRadio {
/*margin-top: 60px;*/
padding: 0;
/*margin-bottom: 60px;*/
text-align: center;
display: none;
margin: auto;
}
#r_neutral.css-checkbox {
border: 0px;
height: 1em;
width: 1em;
/*30px;*/
}
#r_ablehnung.css-checkbox, #r_zustimmung.css-checkbox {
border: 0px;
height: 1.5em;
/*40px;*/
width: 1.5em;
}
#r_starkeAblehnung.css-checkbox, #r_starkeZustimmung.css-checkbox {
border: 0px;
height: 3em;
/*50px;*/
width: 3em;
}
JavaScript
$("#questionAnswerRadio").css("display", "block");