A part of styles didnt work when i add <!DOCTYPE html>

Question

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);
}

Answer 1

From your screenshot, the class name for the tweet button is TweetBT , whereas in your button.css it's .tweetBT , which should be .TweetBT .
As the class name is not matching, the CSS is not applied. It's not an issue with !DOCType Html.

A part of styles didnt work when i add <!DOCTYPE html>

Question

1 answers

solution1
0 ACCPTED 2022-07-05 19:12:08

A part of styles didnt work when i add <!DOCTYPE html>

Question

1 answers

solution1 0 ACCPTED 2022-07-05 19:12:08

solution1
0 ACCPTED 2022-07-05 19:12:08