basic css positioning 1

[davikokar]

hallo,

I cannot find out how to reach a layout that using tables would be really easy: a picture on the left, centered text in the middle, a picture on the right.

This would be the table layout:

<table style="width:500px;background-color:#ff0000;">
  <tr>
    <td style="width:80px;text-align:left;">image</td>
    <td style="text-align:center;">text text text</td>
    <td style="width:80px;text-align:right;">image</td>
  </tr>
</table>

I have tried different combinations but they never works on all browser, here is the code that I wonder why it does not work:

<div style="width:500px;background-color:#ff0000;text-align:center;">
  <img src="print.gif" style="float:left;" />
  <p style="background-color:#00ff00;display:inline;">text text</p>
  <img src="print.gif" style="float:right;" />
</div>

Does someone can help?
thanks

 

[Vragabond]

How about:

<div style="width:500px;background-color:#ff0000;text-align:center;">
  <img src="print.gif" style="float: left;" />
  <img src="print.gif" style="float: right;" />
  <p style="background-color: #00ff00;">text text</p>
</div>

Untested.

 

[davikokar]

yes it works