The positions of text change when you preview a Web page in Expression Web, in SharePoint Designer, or in FrontPage by using "Preview in Browser"

When you preview a Web page in Microsoft Expression Web, in Microsoft Office SharePoint Designer 2007, or in Microsoft FrontPage by using Preview in Browser, the positions of any text, pictures, or other items change and move about in the browser window as you resize the browser window.

This problem occurs when you use absolute positioning to position objects on the Web page. Absolute positioning permits you to put an element at an exact location on a page.

An absolutely positioned page element is independent from other elements on the page. It is positioned such that the upper left corner of the element is always at the same pixel coordinates. This behavior is unlike an inline element that would move in conjunction with other elements, float on top of, or sit behind other elements, such as text elements. Text does not flow around absolutely positioned elements.

When you view the element at different screen resolutions, the element might not be placed as you intended, although the element still appears at the pixel coordinates that you specified. When the screen resolution changes, the layout also changes because other page elements (such as text) are displayed differently. To make sure that your pages are displayed well to all site visitors, test your pages in a variety of browsers and screen resolutions.

To work around this problem, you can use tables to position various elements. When you create tables, you must use a set pixel width, instead of a percentage of page size width. Put the objects, pictures, text, and other elements in different table cells.

To create a fix width table, follow these steps:

1. Put the insertion point where you want to insert the table.
2. On the Table menu, point to Insert, and then click Table.
3. Click to select the In pixels check box, and then type the width that you want the table to be in pixels.
4. In the Rows box, type the number of rows that you want.
5. In the Columns box, type the number of columns that you want.
6. In the Alignment box, select the position for the table on the page.
7. In the Border box, type the width that you want for the table border in pixels. If you do not want a border, type 0.
8. To change the cell padding of the table (the space between a cell's border and the content), type a number in the Cell padding box.
9. To change the cell spacing of the table (the space between cells), type a number in the Cell spacing box.