Now that you have
completed the site, thoroughly check it in the browser. Use File >
Preview in Browser and select the various browsers. Check the site in at
least Internet Explorer and Mozilla Firefox.
Sometimes it will look a bit different in different browsers. Check
to make sure everything is working fine. Test the menu links to see if
the right pages are being called up.
You might also decide to make some layout improvements. In this case, the submenu and content area is sticking to the menu area as this does not look good. Also the content is touching the footer area. Let us add some space between the ‘menu’ and ‘middle’ div. To do this:
Save all files to make sure your styles.css file is saved and check your site in the browser. The added space makes it look much better.
You might also find that the content is touching the edge of the browser on the right. We can add some space by reducing the width of the ‘middle’ div to 95% from 100%.
Edit the #middle style and change the width to 95%
Check your site again in the browser to make sure everything is working fine.
We have now completed the site.
You might also decide to make some layout improvements. In this case, the submenu and content area is sticking to the menu area as this does not look good. Also the content is touching the footer area. Let us add some space between the ‘menu’ and ‘middle’ div. To do this:
- Open the CSS styles panel [Window > CSS Styles]
- Select the #menu style
- Right click and select ‘Edit style’
- Box > Margin > Bottom : 20 px
Save all files to make sure your styles.css file is saved and check your site in the browser. The added space makes it look much better.
You might also find that the content is touching the edge of the browser on the right. We can add some space by reducing the width of the ‘middle’ div to 95% from 100%.
Edit the #middle style and change the width to 95%
Check your site again in the browser to make sure everything is working fine.
We have now completed the site.
0 comments:
Post a Comment