Border and Radius
Lesson 5 of 8 in Coddy's CSS Project - Fancy Button course.
button element in HTML comes with a default border, let's customize it!
To make rounded border use border-radius property (use the same values as in padding or margin), for example,
#rounded {
border-radius: 8px;
}To remove the border entirely you can override using,
#no-border {
border: none;
}Tip: if you set the
border-radiusto big value it will get a circle shape!
Challenge
EasyTasks:
- Change the border radius to greater than 0
- Change the border to something different than the default
Try it yourself
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<!-- Write HTML code here -->
</body>
</html>