0
Ich versuche, Text mit Optionsfeld und Kontrollkästchen auszurichten. Ich verwende Bootstrap zum Einstellen des Seitenlayouts. Bitte mein Markup und korrigieren Sie meinen Code. Ich habe das Snippet für weitere Details hinzugefügt. Ich brauche alle Radiobuttons horizontal ausgerichtet mit Text.wie Sie horizontalen Text mit Optionsfeld und Kontrollkästchen im Bootstrap ausrichten
input[type="checkbox"], input[type="radio"] {
padding: 0;
box-sizing: border-box;
width: 30px;
height: 30px;
background-color: #edf8f7;
/* background-image: none; */
border: 1px solid #8dc6cd;
border-radius: 0px;
}
input[type=checkbox], input[type=radio] {
margin: 4px 0 0;
margin-top: 1px\9;
line-height: normal;
}
input[type=checkbox], input[type=radio] {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
}
button, input, select, textarea {
font-family: inherit;
font-size: inherit;
line-height: inherit;
}
input {
line-height: normal;
}
button, input, optgroup, select, textarea {
margin: 0;
font: inherit;
color: inherit;
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
input[type="radio" i] {
margin: 3px 3px 0px 5px;
}
input[type="radio" i] {
-webkit-appearance: radio;
box-sizing: border-box;
}
input[type="radio" i], input[type="checkbox" i] {
background-color: initial;
margin: 3px 0.5ex;
padding: initial;
border: initial;
}
input {
-webkit-appearance: textfield;
background-color: white;
-webkit-rtl-ordering: logical;
user-select: text;
cursor: auto;
padding: 1px;
border-width: 2px;
border-style: inset;
border-color: initial;
border-image: initial;
}
input, textarea, select, button {
text-rendering: auto;
color: initial;
letter-spacing: normal;
word-spacing: normal;
text-transform: none;
text-indent: 0px;
text-shadow: none;
display: inline-block;
text-align: start;
margin: 0em;
font: 13.3333px Arial;
}
input, textarea, select, button, meter, progress {
-webkit-writing-mode: horizontal-tb;
}
label {
display: inline-block;
margin-bottom: 5px;
/* font-weight: bold; */
color: #6b7b8a;
font-size: 18px;
font-weight: bold;
}
label {
display: inline-block;
max-width: 100%;
margin-bottom: 5px;
font-weight: 700;
}
body {
background: #fff;
font-family: 'Roboto', sans-serif;
color: #54667a;
line-height: 22px;
}
body {
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 14px;
line-height: 1.42857143;
color: #333;
background-color: #fff;
}<html>
<head>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
<section id="listing">
<form id="frmR" action="#" method="post">
<h4> Type</h4>
<div class="row">
<div class="col-xs-12" >
<div class="col-xs-4">
<div >
<label class=""> Type</label>
<label ><input type="radio" name="Type" checked="" value="Walk-In">Walk-In</label>
<label ><input type="radio" name="Type" value="Telephonic">Telephonic</label>
</div>
</div>
</div>
</form>
</section>
<hr />
<section id="bottom">
</div>
</section>
</body>
</html>
perfekt. Danke – user6306245