Search code examples
cssborder

Why does my CSS doesn't apply when using shortcut for setting up the CSS border?


I am currently learning CSS and I am on the part of course where the guy showed that you can use two different types of syntax to setup borders, but the 2nd one is something like shortcut. There I experienced problems.

So when I do this:

h1 {
    color:rgba(4, 176, 15,.9)
    border-color:purple;
    border-width:5px;
    border-style:solid;
} 

It is working perfectly. But when I do the next thing:

border: 5px solid purple;

It doesn't work.

This is HTML file:

<!DOCTYPE html>
<html>
<head>
    <title>About Me</title>
    <link rel="stylesheet" type="text/css" href="C:\Users\aldin\OneDrive\Desktop\WebDev Kurs Zadatci\CSS\app.css">


</head>
<body>

<h1>About Me</h1>
<h4>My Hobbies: </h4>
<div>
<ul>
    <li>Programming</li>
    <li>Eating</li>
    <li>Playing video games</li>
</ul>
</div>
</body>
</html>

and this is app.css file:

h1 {
    color:rgba(4, 176, 15,.9)
/*  border-color:purple;
    border-width:5px;
    border-style:solid;*/

    border: 5px solid purple;
}

h4 {
    background: rgb(255,100,80)
}

body{
    background:pink;
    /*background: url(https://catchafallingstarbook.files.wordpress.com/2019/09/u-g-q104w810.jpg);
    background-repeat: no-repeat;
    background-size: cover;*/
}

Where am I making mistake?


Solution

  • You are missing a semicolon in your h1. Try this

    h1 {
        color: rgba(4, 176, 15, .9);
        border: 5px solid purple;
    }