A little blog for a restless mind

HTML+CSS and Layout

This is soooo twisted I just don't like it. Okay, let me see if I can find a beginning to this.
I have some amateurish knowledge about desktop publishing. I know (or knew, since it's been a long time since I last used it) TeX and LaTeX. I like it very much; if it were left to me, I'd write everything using LaTeX and send .tex, .dvi or .pdf files around. But no, I have to write things so they can be opened with Word, but that's another story.
Now I have this problem: lay out an HTML document so it looks like this:

This is the first line. And centered.

The catch is in displaying what follows the first line so that it's centered relative to the first line, and the first line must start at the left margin. Not center everything to the whole width of the browser's window, like this:


With LaTeX, no problem: \vbox{centered content}\hfill, but with HTML I have to use a table, like this:

<table>
  <tbody>
    <tr>
      <td>
        bloody centered content
      </td>
    </tr>
  </tbody>
</table>

Awful. And it even doesn't work always, like if you're messing with styles. Like this damn blogger thing. For it I had to "enhance" the code with a few more tricks. The final code is this annoying kaboodle:

<table>
  <colgroup>
    <col width="0*" />
    <col width="*" />
  </colgroup>
  <tbody>
    <tr>
      <td>
        <div style="text-align: center">
          <span style="border-style: solid; border-color: red; border-width: thin">This&nbsp;is&nbsp;the&nbsp;first&nbsp;line.</span><br />
          <span style="border-style: solid; border-color: blue; border-width: thin">And centered.</span>
        </div>
      </td>
      <td>
      </td>
    </tr>
  </tbody>
</table>

Anyway, this is not the recommended way of formatting. Tables are meant for tabular data, they're meant for logical data encapsulation, not visual formatting of pages. For anything visual, there's CSS. But the only way I can achieve that with CSS is to use the "position: absolute" or "position: fixed" style. And I don't want that. Absolute positioning means I'd have to provide the positioning parameters (top, left, width, height). At least I think so. The CSS specs are so complicated I don't fully grok them yet. And I don't know how wide is the first line. It depends on what font the browser is using to display it. So I'm doomed. Unless I'll discover some CSS magic.

If I could only code a proggy that would emit LaTeX code, then compile it to .dvi, convert to .pdf, and finally send it to the client. Instead of HTML code. But that wouldn't be interactive, I need users to click and fill out forms.

posted by AlesS @ 9/03/2004 04:41:00 PM