The style of y "Tweet" button disappears whem i adding !DOCTYPE html.
<!DOCTYPE html>
<html>
<head>
<title>Buttons</title>
<link rel="stylesheet" href="styles/buttons.css">
</head>
<body>
<button class="buttonYT">SUBSCRIBE</button>
<button class="JOIN">JOIN</button>
<button class="Tweetb">Tweet</button>
</body>
</html>
css part of Tweet button from button.css
.tweetb {
background-color: rgb(29, 155, 240);
color: white;
border: none;
height: 36px;
width: 74px;
border-radius: 20px;
font-weight: bold;
font-size: 15px;
cursor: pointer;
margin-left: 8px;
transition: box-shadow 0.15s;
vertical-align: top;
}
.tweetb:hover {
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.15);
}
>Solution :
- From you screenshot class name for tweet button is
TweetBT., whereas in youbutttons.cssit’s.tweetBT, which should be.TweetBT.
As class name is not matching so CSS is not applied it’s not an issue with !DOCType Html. It’s because classname selector is not matching.