How to vertically align a html radio button to it’s label?

in CSS & HTML on October 18, 2020

Solution

This worked for me.

There are other solutions available fir e.g. using display:table-cell, adjust label or adjust label and radio button both. Use whichever works for you.


input[type="radio"] {
  margin-top: -1px;
}

align button display html tags labels property radio solution vertically

« Previous Next »

Recently Posted

Apr 8 JSON.stringify() in JavaScript Apr 7 Middleware in NextJS Jan 17 4 advanced ways to search Colleague Jan 16 Colleague UI Basics: The Search Area Jan 16 Colleague UI Basics: The Context Area

Most Read

#1 Solution to the error “Visual Studio Code can’t be opened because Apple cannot check it for malicious software” #2 How to add Read More Read Less Button using JavaScript? #3 How to check if radio button is checked or not using JavaScript? #4 Solution to “TypeError: ‘x’ is not iterable” in Angular 9 #5 PHP Login System using PDO Part 1: Create User Registration Page

Check if mixin is being called in a style rule or not in SCSSSCSS JSON.stringify() in JavaScriptJavaScript The SQL UNION OperatorSQL/MySQL Review an intentionally vulnerable plugin in WordPressWordPress How to remove trailing characters from a string using JavaScript?JavaScript Where is the PHP log file located on Mac OS?PHP How to show and hide an element on click in React?React How to pass arguments in SCSS function?SCSS Values and Types Basics in JavaScriptJavaScript How to install Gulp with WordPress?WordPress What is Object Mutability in JavaScript?JavaScript WordPress: How to query all posts from custom post type and display them in a list?WordPress