From the course: HTML & CSS: Creating Forms

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Styling text inputs

Styling text inputs - HTML Tutorial

From the course: HTML & CSS: Creating Forms

Start my 1-month free trial

Styling text inputs

- [Instructor] In this video, you will learn how to style a text entry inputs. So this will cover all the different inputs where you type, such as text or number, but not other types of entry like check boxes or select. We're going to start out with a webpage where I've included one of each type of field. So this is what all of them look like without any styles. In the CSS at the top, the first two things I have are the default styles that we looked at in the last couple videos. The last thing here is just a list of all the different input elements as selectors with no styles applied to them yet. So I'm going to start with applying a width as a style. You can see above that I've applied that to input type text, input type url, et cetera, all of the input types including text area. So I'm going to save that and go to the browser and refresh. Now they're all the same width. I used ems to size them, so that we will change with the font size, so if I have a large font size in one of these…

Contents