Troubleshooting

If parts of your page are overlapping or appear in odd positions, try checking the following. The page is divided into three sections, each of which is represented by a DIV tag. With both the code and design views visible (see instructions), check their code as follows:

1. There are two vertical lines in the middle of the page's design window. Click on the leftmost of these lines, and then check the code that's highlighted in the code window. It should start with something like:
   
   <div class="region" style="top: 5%; left: 0px; width: 60%; height: 95%;">

   If part of the code corresponding to the above line is different, change the code in your page to match it.
2. Now click on the rightmost of the two lines, and check the code in the code window. Ensure that it starts with:
   
   <div class="region" style="top: 5%; left: 61%; width: 39%; height: 95%;">
   
   
3. Now click anywhere in the bar of blue links at the top of the Design window. Move the mouse cursor down slowly until the cursor becomes a four-pointed arrow. Then click immediately and check that the highlighted code in the code window begins with the following:
   
   <div class="region" style="top: 0px; left: 0px; width: 100%; height: 5%;">

Now be sure to save your page in Dreamweaver. Now when you refresh the page in Mozilla, it should be laid out properly.

Back to Instructions