How to make a div with no content have a width?

Question

I am trying to add a width to a div, but I seem to be running into a problem because it has no content.

Here is the CSS and HTML I have so far, but it is

Answer 1

There are different methods to make the empty DIV with float: left or float: right visible.

Here presents the ones I know:

• set width(or min-width) with height (or min-height)
• or set padding-top
• or set padding-bottom
• or set border-top
• or set border-bottom
• or use pseudo-elements: ::before or ::after with:
  • {content: "\200B";}
  • or {content: "."; visibility: hidden;}
• or put   inside DIV (this sometimes can bring unexpected effects eg. in combination with text-decoration: underline;)