html - What invisible content to add to a div so it shows up in the page? -

i'm trying make contentless div show in page:

<div class="modal-border"></div>  .modal-border {   background-color: $primary-color   width: 5px   height: 100%    &:before {     content: ' '   } }

i thought content: ' ' make trick ... div shows when content: 'content'. however, don't want show content.

what's best way deal this?

for content, add unicode \00a0 non-breaking space. so,

div::before { content: "\00a0"; } note it's two colons.

you don't need height property , may not need width property. if want set width, you'll need display:inline-block; or block ::before property.

make sure specify utf-8 in <head>

<meta charset="utf-8">

ANy