Saya mahu membuat teks di tengah kelas "togol-label" secara menegak dengan "suis" tetapi saya gagal Ini kod yang saya gunakan
.toggle-label { font-weight: bold; font-size: 20px; } .switch { position: relative; display: inline-block; width: 54px; height: 28px; } .switch input { opacity: 0; width: 0; height: 0; } .slider-round { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; border-radius: 34px; } .slider-round:before { position: absolute; content: ""; height: 20px; width: 20px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s; border-radius: 50%; } .switch input:checked+.slider-round { background-color: #e53f71; } .switch input:focus+.slider-round { box-shadow: 0 0 1px #e53f71; } .switch input:checked+.slider-round:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); }
<span class="toggle-label">BGM</span> <label class="switch" style="margin-right: 20px;"> <input type="checkbox" id="bgm" checked> <span class="slider-round"></span> </label> <span class="toggle-label">SFX</span> <label class="switch"> <input type="checkbox" id="sfx" checked> <span class="slider-round"></span> </label>
Saya cuba menetapkan padding atas tab togol tetapi ia masih tidak berfungsi Tolong bantu saya memusatkan label togol secara menegak dengan suis
Cuba tambah
Penjajaran menegak: tengah;
ke .togol-label dan .tukar.
Ini sepatutnya membuatkan mereka selesa antara satu sama lain.