How to Center a Background Image Using Dreamweaver


If you're building your own website, there are a lot of design decisions to make. What color scheme do you want to use? What kind of layout is best for your content? What kind of background to use?

Background images can make a big impact on visitors to your website. Some people use actual photographs for the background. Others use design elements to give the content containers that special touch. Regardless of what type of background image you use, it helps when you know how to center the image regardless of the size of the web browser.


Of course, you can always use html to center your background, but if you're like me when it comes to coding websites, there's a much easier way. If you're using CSS and div id containers to create your website, you should save your style sheet in a separate folder. Once you have your style sheet set up, you can edit the CSS rules as needed.


Although there is an option under page properties to set up a background image, do not use page properties to insert or adjust your background image. If you want to have more control over the positioning of your background image, do not use page properties.


Under Style and Body, you will find the CSS rule that you want to edit. You can find the Body Style under the CSS Styles tab in the upper right corner, or in the lower left corner of your window. Click on Edit Rule and the options will be displayed for background just like any other CSS rule.


Once you click on Background, you should see the options available to upload an image and display the background image according to the preferences you want. You can set it to scroll or fixed, as well as center the image Horizontally and vertically. Experiment with the different settings until you get it exactly how you want it.


Leave a Reply