Search code examples
htmlcss

CSS, fill all div width with text


How to automatically change the space between the letters.I want the text to take up the entire width of the div. Text is not static. (Always changing text, can be 123" or "text text"...)

  <style type="text/css">
    #menu{
      width: 200px;
      background-color: #000;
      color: #336699;
      font-size: 16px;
      letter-spacing: 100%;
    }
  </style>
<body>
<div id="menu">
  tekstas
</div>

Solution

  • EDIT: Unfortunately this only changes word spacing, not letter spacing. There is not way to do kerning in CSS. Possibly CSS3, however.

    This is easily accomplished with the text-align: justify CSS attribute:

    #menu 
    { 
          width: 200px; 
          background-color: #000; 
          color: #336699; 
          font-size: 16px; 
          text-align: justify; 
    }