Home/ Questions/Q 8885137
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T21:14:08+00:00

A concrete example: I have a menu: a list, which shows daughterly lists on

  • 0

A concrete example:

I have a menu: a list, which shows daughterly lists on :hover over its elements. For such a daughterly list I didn’t set any specific width or height. I don’t want to set a fixed width for the daughterly list, but don’t want the linebreaks to occur as long as the daughterly menu entries can fit in one line, but for some reason browser does make the linebreaks after every word.

Most importantly, I wonder, what’s the algorithm of putting the linebreaks. Tried to read CSS2.1 specification, failed to find the answer so far. (clarification: the parental list is positioned relative, the daughterly one – absolute; no floats; parental list is displayed inline-block).

enter image description here

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Setting the whitespace on the li units should do what you want.

    li{white-space:nowrap;}

    As to how it’s deciding, it is setting it to the smallest possible width. In your case Header is the widest single element so it breaks there, if there were a word longer than header it would go to the width of that word.

    • 0