CODEWITHSUNDEEP
htmlcss
brownmagik352
brownmagik352

Reputation: 396

Why is the border property not working on list item?

Sorry for asking such an easy question, but I'm stuck and the existing answers aren't working for me. I've boiled it down to the simplest case of a list but I can't get borders to show.

html,
body,
h1,
h2,
h3,
p,
ol,
ul,
li,
a {
  padding: 0;
  border: 0;
  margin: 0;
  font-size: 100%;
  font: inherit;
}


/* feed styling */

.feed ul {
  list-style-type: none;
  text-align: left;
}

.feed ul li {
  border: 10px single black;
  list-style-position: inside;
}
<body>

  <div class="feed">
    <ul>
      <li>Item1</li>
      <li>Item2</li>
      <li>Item3</li>
      <li>Item4</li>
    </ul>
  </div>

</body>

Upvotes: 1

Views: 1358

Answers (1)

Ricky Dam
Ricky Dam

Reputation: 1895

border: 10px single black; is incorrect.

Use border: 10px solid black;

html,
body,
h1,
h2,
h3,
p,
ol,
ul,
li,
a {
  padding: 0;
  border: 0;
  margin: 0;
  font-size: 100%;
  font: inherit;
}

.feed ul {
  list-style-type: none;
  text-align: left;
}

.feed ul li {
  border: 10px solid black;
  margin: 5px 0px;
  list-style-position: inside;
}
<div class="feed">
  <ul>
    <li>Item1</li>
    <li>Item2</li>
    <li>Item3</li>
    <li>Item4</li>
  </ul>
</div>

Upvotes: 4

Related Questions