I need help Centering a div box to a background image using dreamweaver cs5.5.

I need help Centering a div box to a background image using dreamweaver cs5.5. Everything shift left when viewing on different size monitors?  See what I mean at
www.woodlandhospice.com

Have you looked at your page with images disabled?
I urge you to re-think this approach to web design because images of text are not indexed by search engines, screen readers or translators.  Given the demographic group your site is targeting, you really need to ensure maximum web accessibility for all users.
Navigation, headings and descriptions all need to be in real text -- not images of text.
Ken is right.  Absolute positioning is pure poison for such a simple layout.  My advice is to start over with one of the pre-built Starter Pages in DW.  Go to File > New > Blank page > HTML.  Select a layout from the 3rd column and hit CREATE button.
Nancy O.

Similar Messages

  • I need help centering a div!

    Hi!
    So i'm attempting to set up all the body content in my website so that it is always in the center of my webpage dispite the size of the browser. I had it going fine for a while, but then something happened and I lost it. What did I do wrong?
    Help!!
    Here is my complete code so far:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    body {
              background-image: url(images/images/images/images/baby_03.png);
    #apDiv1 {
              position:absolute;
              width:202px;
              height:153px;
              layer-background-color:#000;
              border:1px none #000000;
              z-index:1;
              left: 41px;
              top: -1px;
    #apDiv2 {
              position:absolute;
              width:200px;
              height:115px;
              layer-background-color:#000;
              border:1px none #000000;
              z-index:2;
              left: 480px;
              top: 148px;
    #apDiv3 {
              position:absolute;
              width:200px;
              height:43px;
              layer-background-color:#000;
              border:1px none #000000;
              z-index:2;
              left: 254px;
              top: 2px;
    #apDiv4 {
              position:absolute;
              width:200px;
              height:40px;
              layer-background-color:#000;
              border:1px none #000000;
              z-index:3;
              left: 285px;
              top: 2px;
    #Layer1 #apDiv4 pre {
              font-family: helvetica;
              font-size: 18px;
              color: #EAEAEA;
    #apDiv5 {
              position:absolute;
              width:200px;
              height:115px;
              layer-background-color:#000;
              border:1px none #000000;
              z-index:4;
              left: 588px;
              top: 135px;
    #apDiv6 {
              position:absolute;
              width:200px;
              height:115px;
              layer-background-color:#000;
              border:1px none #000000;
              z-index:4;
              left: 539px;
              top: 80px;
    #apDiv7 {
              position:absolute;
              width:200px;
              height:115px;
              layer-background-color:#000;
              border:1px none #000000;
              z-index:4;
              left: 537px;
              top: 62px;
    #apDiv8 {
              position:absolute;
              width:549px;
              height:115px;
              layer-background-color:#000;
              border:1px none #000000;
              z-index:4;
              left: 556px;
              top: 64px;
    #apDiv9 {
              position:absolute;
              width:200px;
              height:115px;
              layer-background-color:#000;
              border:1px none #000000;
              z-index:5;
              left: 66px;
              top: 177px;
    #menue {
              background-color:#2C2929;
              padding:1px;
              text-align:right;
              font-family:Arial, Helvetica, sans-serif;
    body,td,th {
              font-size: 13px;
              font-family: Arial, Helvetica, sans-serif;
              color: #FFF;
              color: #FFFFFF;
    #textone {
              font-family:Arial, Helvetica, sans-serif;
    #Layer1 div #menue pre {
              font-family: Arial, Helvetica, sans-serif;
    </style>
    </head>
    <div id="Layer1" style="margin-left:auto; margin-right:auto; width:938px; height:100%; z-index:1; layer-background-color: #9999FF; border: 1px none #000000;"><body text="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" style="text-align:center; width: 938px;">
      </div>
        <div id="menue">
          <pre>PORTFOLIO       RESUME       CONTACT</pre>
        </div>
        <img src="images/images/images/images/autumn_06.png" width="938" height="439" />
    <div>
      <table width="938" border="0" cellspacing="10px" cellpadding="0">
        <tr>
          <th scope="col"><p align="center">WHO I AM:</p>
          <p align="center">People often remark that I'm pretty lucky. Luck is only important in so far as getting the chance to sell yourself at the right moment. After that, you've got to have talent and know how to use it. - Fank Sinatra</p>
          <p align="center">Similar to Ol' Blue Eyes, I've got talent and I know how to use it. I'm an ambitious graphic designer from New York. I love design and am constantly learning more about this ever changing trade. I also dabble in scientific illustration and gardening.</p></th>
          <th scope="col"><p align="center">WHAT I DO:</p>
          <p align="center">I'm knowledgeable in Adobe Photoshop, Illustrator, InDesign, Dreamweaver, and Flash. I create print material, design logos, and build websites that stand out amoungst the rest. Currently an intern at Flourish Design Studio and a student a Marywood University, I have developed this site in order to showcase my work for future employers.</p>
          <p align="center">Some examples of my work can be found here.</p>
          <p align="center"><th scope="col"><script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
    <script>
    new TWTR.Widget({
      version: 2,
      type: 'profile',
      rpp: 4,
      interval: 30000,
      width: 250,
      height: 300,
      theme: {
        shell: {
          background: '#333333',
          color: '#ffffff'
        tweets: {
          background: '#000000',
          color: '#ffffff',
          links: '#0a8082'
      features: {
        scrollbar: false,
        loop: false,
        live: false,
        behavior: 'all'
    }).render().setUser('SaraLynnLuciano').start();
    </script></th></p></th>
        </tr>
      </table>
    </div>
    </div>
    </body>
    </html>

    APDivs, oh my!  I don't recommend building primary layouts with APDivs. In the long-run you will regret it.  Here's why:
    http://apptools.com/examples/pagelayout101.php
    That said, wrap your content inside a #wrapper division that has a stated width in pixels, a margin-left and margin-right of auto, AND position:relative to contain those pesky APDivs.
    CSS:
    #wrapper {
    position:relative;
    width: 990px;
    margin:0 auto;
    HTML:
    <body>
         <!--begin wrapper-->
         <div id="wrapper>
              your page content goes here.....
         </div>
    </body>
    </html>
    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics | Print | Media  Specialists 
    http://alt-web.com/
    http://twitter.com/altweb

  • Need Help, retrieving a combo boxes actual/print/visible value instead of the export value.

    Hello,
    I need help, retrieving a combo boxes actual value, not the export value.
    I have a combo box with multiple options to select from.
    each of those selections has a separate export value, which is in the form of a number, which I use to calculate dates in a separate field.
    However, I have another field that i want to retrieve the, users selected value, which is text, from the combo box instead of the export value.
    Is there an easy way to do this.
    This is what I am currently using. But like I said the results are that I retrieve the export value and not the selected text value.
    event.value = this.getField("_Arugula").valueAsString;
    Thanks

    First get the currentValueIndices property of the combo box and use it with the getItemAt field method to return (what I call) the display value. Something like:
    var f = getField("combo1");
    var display_value = f.getItemAt(f.currentValueIndices, false);
    See the documentation for more information

  • I need help with a PDF file that is an image, the "Read Out Loud' option does not work, please help!

    I need help with a PDF file that is an image, the "Read Out Loud' option does not work, please help!

    You mean an image such as a scanned document?
    If that is the case, the file doesn't contain any text for Reader Out Loud to read. In order to fix that, you would need an application such as Adobe Acrobat that does Optical Character Recognition to convert the images to actual text.
    You can also try to export the file as a Word document or something else using ExportPDF which I believe offers OCR and is cheaper than Acrobat.

  • Need help about the SHA Message Digest ? & what is use of Message Diagest ?

    need help about the SHA Message Digest ? & what is use of Message Diagest ?
    1>i have one program of making message digest
    2>which requires two files name
    3>one for input like txt
    4> second is out put file of message digest
    can any one tell what is the use of second generated file .

    MessageDigest md = MessageDigest.getInstance("SHA");
    FileInputStream fis = new FileInputStream(args[0]);
    byte[] b = new byte[1024];
    int readed = -1;
    while((readed = fis.read(b)) > 0)
         md.update(b, 0, readed);
    fis.close();
    FileOutputStream fos = new FileOutputStream(args[1]);
    byte[] d = md.digest();
    StringBuffer sb = new StringBuffer();
    for(int i = 0; i < d.length; i++) {
         String str = Integer.toHexString(d[i] & 0xff);
         sb.append(str.length() < 2 ? "0" + str : str);
    fos.write(sb.toString().getBytes());
    fos.close();

  • I would like to remove a short gray edge from two images. I need help in that I am not yet able to use PhotoShop. Could somebody kindly help me with this?

    I would like to remove a short gray edge from two images. I need help in that I am not yet able to use PhotoShop. Could somebody kindly help me with this?

    I doubt it Doc Maik, but I am certainly happy to learn The image is this one (and a similar one). They would be beautiful portraits if not for the "extra mouth". The grey edge that I would like to remove is the excess of (grey) mouth that is actually my horse's chin, but that in the pictures looks like a wider, looping mouth. Practically, looking at the picture, the "extra mouth" to the left. What I would love it to be able correct that to look like a normal mouth, which means that half of the protruding edge should be removed. I am not sure I was able to explain myself, but here is one of the two pictures. I thank you for you kindness in being available to advise me.

  • Not seeing div background image in Dreamweaver! Why?

    I'm not seeing div backgrounds in Dreamweaver! When I load the files onto my server I can see them in my browser! But I'm not seeing them in Dreamweaver. Here's my code on my .aspx pg:
    <link href="styles/styles.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
    <div id="container">
        <div id="hdr">
        </div><!-- end "hdr" div -->
    </div><!-- end "container" div -->
    </body>
    And here's a link to the web page on my server:
    http://amcenergy.com/ee_site1/index.aspx
    I need to put text on top of the div's background image, but it's kinda hard if I can't see the background image in Dreamweaver.
    Hope someone can help!
    Thanks so much!!

    Horizontal-align is not a valid CSS property.
    http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=http%3A%2F%2Famce nergy.com%2Fee_site1%2Findex.aspx
    Try removing it.
    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics | Print | Media  Specialists
    www.alt-web.com/
    www.twitter.com/altweb
    www.alt-web.blogspot.com

  • Can anyone help me to add method to rotate the image using mouse?

    Hi everyone, i am currently creating a game which require the user to be able to drag and rotate the image
    on the screen..but sadly...i'm only able to do the dragging part..
    Can anyone be able to help me add the method to rotate the image using the mouse?
    Thanks :-)
    the code
    import javax.swing.*;
    import javax.swing.border.*;
    import java.awt.*;
    import java.awt.event.*;
    import java.awt.image.*;
    import java.awt.geom.*;
    class Game extends JFrame {
         DisplayCanvas canvas;
         public Game() {
              super("My Game");
              Container container = getContentPane();
              canvas = new DisplayCanvas();
              TitledBorder border = new TitledBorder("Game Window");
              border.setTitlePosition(TitledBorder.BOTTOM);
              canvas.setBorder(border);
              container.add(canvas);
              addWindowListener(new WindowEventHandler());
              setSize(450,400);
              show();
              class WindowEventHandler extends WindowAdapter {
                   public void windowClosing(WindowEvent e) {
                        System.exit(0);
              public static void main(String arg[]) {
                   new Example();
         class DisplayCanvas extends JPanel {
              int x, y;
              BufferedImage bi;
              DisplayCanvas() {
                   setBackground(Color.white);
                   setSize(450,400);
                   addMouseMotionListener(new MouseMotionHandler());
                   Image image = getToolkit().getImage("duke.gif");
                   MediaTracker mt = new MediaTracker(this);
                   mt.addImage(image, 1);
                   try {
                        mt.waitForAll();
                   catch (Exception e) {
                        System.out.println("Exception while loading image.");
                   if (image.getWidth(this) == -1) {
                        System.out.println("***Make sure you have the image "
                        + "(duke.gif) file in the same directory.*****");
                        System.exit(0);
                   bi = new BufferedImage(image.getWidth(this),
                   image.getHeight(this),
                   BufferedImage.TYPE_INT_ARGB);
                   Graphics2D big =bi.createGraphics();
                   big.drawImage(image, 0, 0, this);
              public void paintComponent(Graphics g) {
                   super.paintComponent(g);
                   Graphics2D g2D = (Graphics2D) g;
                   g2D.drawImage(bi, x, y, this);
              class MouseMotionHandler extends MouseMotionAdapter {
                   public void mouseDragged(MouseEvent e) {
                        x = e.getX(); y = e.getY();
                        repaint();

    research a bit on AffineTransforms. you can set the rotated instance of the Graphics2D class and it will do the rotations for you :-D

  • Need help centering DIV in CSS

    Hi- I had a "coming to jesus" last night regarding my website.  I've been out of the professional web design world for about 7 years.  I'm getting back in it.  I used to design in tables and after some reading, I know I need to design in DIV.  My problem is I do not know how to get my main section centered on the page.
    I did a sketch up of what I want in layout terms.
    Any suggestions on how to center a 980px div?
    Here's a link to my current page with table layout.
    http://www.prodentite.com/patient_edu/index.htm
    Any help is appreciated.

    This is a very common question, so an article has been published in the Dreamweaver FAQ
    Centering a page:
    http://forums.adobe.com/thread/454036
    Nadia
    Adobe® Community Expert : Dreamweaver
    http://www.perrelink.com.au
    Unique CSS Templates | Tutorials | SEO Articles
    http://www.DreamweaverResources.com
    http://twitter.com/nadiap

  • Need help with overlapping divs!

    Hey everyone,
    I'm working on another website and I have come up against a common problem for newbie designers from what I hear, the dreaded overlapping div problem!  I have a 2 column fixed layout with a floating left div.  My left div has my nav bar and various images.  When my main content div has more content than the left floating div, the left div border does not reach the footer!  Until now, I have gotten by with just hitting return in my left column div until it reaches the footer.  I am sure it is not the right way to do it but it has worked so far.  The problem is, now one of the pages has the left column div overlapping onto the footer!  I did some reading and I am guessing it involves either the box properties or clear float which I am not too familiar with.
    Any advice would be stellar!  I know this is just another stumbling block to get over but I would feel so much better if I was doing it the right way. 
    Here are screens of my issue,
    And here is my code for the page in question.
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="shortcut icon" href="http://www.xldesignsonline.com/fchi/favicon.ico">
    <title>Full Circle Home Inspections</title>
    <link href="_css/main.css" rel="stylesheet" type="text/css" /><!--[if IE 5]>
    <style type="text/css">
    /* place css box model fixes for IE 5* in this conditional comment */
    .twoColFixLtHdr #sidebar1 { width: 230px; }
    </style>
    <![endif]--><!--[if IE]>
    <style type="text/css">
    /* place css fixes for all versions of IE in this conditional comment */
    .twoColFixLtHdr #sidebar1 { padding-top: 30px; }
    .twoColFixLtHdr #mainContent { zoom: 1; }
    /* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
    </style>
    <![endif]-->
    <style type="text/css">
    <!--
    body {
         background-color: #FFF;
    .paragraphLead {
         font-size: 110%;
         font-weight: bold;
    a:link {
         text-decoration: none;
         color: #CF0;
    a:visited {
         text-decoration: none;
    a:hover {
         text-decoration: none;
    a:active {
         text-decoration: none;
    #apDiv1 {
         position:absolute;
         width:236px;
         height:157px;
         z-index:1;
         left: 692px;
         top: 372px;
    #apDiv2 {
         position:absolute;
         width:200px;
         height:192px;
         z-index:2;
         left: 697px;
         top: 1443px;
    #apDiv3 {
         position:absolute;
         width:158px;
         height:204px;
         z-index:2;
         left: 643px;
         top: 1502px;
    -->
    </style>
    <script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
    </head>
    <body class="twoColFixLtHdr">
    <div id="container">
      <div id="header">
        <h1><!-- end #header -->
      </h1></div>
      <div id="sidebar1">
        <h3 align="center">
          <object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="200" height="620">
            <param name="movie" value="_assets/menu.swf" />
            <param name="quality" value="high" />
            <param name="wmode" value="opaque" />
            <param name="swfversion" value="6.0.65.0" />
            <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
            <param name="expressinstall" value="Scripts/expressInstall.swf" />
            <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
            <!--[if !IE]>-->
            <object type="application/x-shockwave-flash" data="_assets/menu.swf" width="200" height="620">
              <!--<![endif]-->
              <param name="quality" value="high" />
              <param name="wmode" value="opaque" />
              <param name="swfversion" value="6.0.65.0" />
              <param name="expressinstall" value="Scripts/expressInstall.swf" />
              <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
              <div>
                <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
                <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
              </div>
              <!--[if !IE]>-->
            </object>
            <!--<![endif]-->
          </object>
        </h3>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://www.nachi.org/"><img src="_images/interNACHI.png" alt="InterNACHI" width="190" height="164" border="0" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://www.nachi.org/education.htm"><img src="_images/education-seal-small.gif" alt="education seal" width="150" height="150" border="0" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://www.iac2.org/"><img src="_images/iac2-all.gif" width="174" height="126" alt="IAC" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://www.inspectopia.com/profile.b.507.r.16181.u.03bcfb.html"><img src="_images/logo_top.png" alt="Inspectopedia" width="190" height="45" border="0" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://www.energystar.gov/"><img src="_images/img_energy_star_partner.jpg" width="160" height="191" alt="Energy Star Partner" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://cjenterprises.myshaklee.com/us/en/welcome.html#"><img src="_images/Shaklee.gif" alt="Shaklee" width="119" height="160" border="0" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://activerain.com/"><img src="_images/ARLogoSmall.gif" alt="Active Rain" width="135" height="36" border="0" /></a></p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"><a href="http://www.insiderpages.com/b/15246780294"><img src="_images/insider_pages.gif" alt="Insider Pages" width="89" height="37" border="0" /></a></p>
    <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
        <p align="center"> </p>
      </div>
      <div id="mainContent">
        <h2>Radon Gas Inspection</h2>
        <div id="paragraphFloat">
          <h5>What Is Radon?</h5>
          <p> Radon is a cancer causing radioactive gas. You cannot see, smell or taste radon, but it may be a problem in your home. The Surgeon General has warned that radon is the second leading cause of lung cancer in the United States today. </p>
          <div id="apDiv1">
        <div align="center"><a href="http://www.epa.gov/radon/video/epa-epu.wmv"><img src="_images/psa_revised.jpg" alt="What Is Radon?" width="200" height="172" border="0" /></a></div></div></div>
        <p>If you smoke and your home has high radon levels, you're at high risk for developing lung cancer. Some scientific studies of radon exposure indicate that children may be more sensitive to radon. This may be due to their higher respiration rate and their rapidly dividing cells, which may be more vulnerable to radiation damage. </p>
    <p> </p>
        <h5>Why Is It Dangerous?</h5>
    <p> The U.S. Environmental Protection Agency (US EPA) and the Surgeon General's Office have estimated that as many as 20,000 lung cancer deaths are caused each year by radon. Radon is the second leading cause of lung cancer. Radon-induced lung cancer costs the United States over $2 billion dollars per year in both direct and indirect health care costs.</p>
    <p>According to the US EPA, nearly 1 in 3 homes checked in seven states and on three Indian lands had screening levels over 4 pCi/L, the EPA's recommended action level for radon exposure.</p>
    <p>The alpha radiation emitted by radon is the same alpha radiation emitted by other alpha generating radiation sources such as plutonium.</p>
    <p>A family whose home has radon levels of 4 pCi/l is exposed to approximately 35 times as much radiation as the Nuclear Regulatory Commission would allow if that family was standing next to the fence of a radioactive waste site. (25 mrem limit, 800 mrem exposure)</p>
    <p> At the 4 pCi/l EPA action guideline level, radon carries approximately 1000 times the risk of death as any other EPA carcinogen. It is important to note that the action level is not a safe level, as there are no &quot;safe&quot; levels of radon gas.</p>
    <p> </p>
    <h5>How Does It Get Into My Home?</h5>
    <p> Radon is a radioactive gas. It comes from the natural decay of uranium that is found in nearly all soils. It typically moves up through the ground to the air above and into your home through cracks and other holes in the foundation. Your home traps radon inside, where it can build up. Any home may have a radon problem. This means new and old homes, well-sealed and drafty homes, and homes with or without basements.</p>
    <p> Radon from soil gas is the main cause of radon problems. Sometimes radon enters the home through well water. In a small number of homes, the building materials can give off radon, too. However, building materials rarely cause radon problems by themselves.</p>
    <p><strong>Radon gets in through:</strong></p>
    <ul>
      <li>Cracks in solid floors
        <div id="apDiv3">
          <div align="center"><a href="http://www.fullcirclehomeinspections.com/_assets/CitizensGuideRadon.pdf"><img src="_images/citguidecoverradon.jpg" alt="Guide To Radon" width="154" height="200" border="0" /></a></div>
        </div>
      </li>
      <li>Construction joints</li>
      <li>Cracks in walls</li>
      <li>Gaps in suspended floors</li>
      <li>Gaps around service pipes</li>
      <li>Cavities inside walls</li>
      <li>Surrounding water supply</li>
    </ul>
    <p> </p>
    <h5>What Can I Do?</h5>
    <p> Radon is a national environmental health problem. Elevated radon levels have been discovered in every state. The US EPA estimates that as many as 8 million homes throughout the country have elevated levels of radon. Current state surveys show that 1 home in 5 has elevated radon levels.</p>
    <p> Testing is the only way to know your home's radon levels. There are no immediate symptoms that will alert you to the presence of radon. It typically takes years of exposure before any problems surface. </p>
    <p>Let <strong>Full Circle Home Inspections</strong> ensure your family and your home are protected and safe from radon exposure!</p>
    <p> </p>
    <h5>Radon Myths</h5>
    <p><strong><em>MYTH:</em> Scientists are not sure that radon really is a problem.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> Although some scientists dispute the precise number of deaths due to radon, all the major health organizations (like the Centers for Disease Control and Prevention, the American Lung Association and the American Medical Association) agree with estimates that radon causes thousands of preventable lung cancer deaths every year. This is especially true among smokers, since the risk to smokers is much greater than to non-smokers.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> Radon testing is difficult, time-consuming and expensive.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> Radon testing is easy. You can test your home yourself or hire a qualified radon test company. Either approach takes only a small amount of time and effort.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> Homes with radon problems can't be fixed.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> There are simple solutions to radon problems in homes. Hundreds of thousands of homeowners have already fixed radon problems in their homes. Most homes can be fixed for about the same cost as other common home repairs; check with one or more qualified mitigators. Call your <a href="http://www.epa.gov/radon/whereyoulive.html">state radon office</a> for help in identifying qualified mitigation contractors.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> Radon affects only certain kinds of homes.</strong></p>
    <blockquote>
      <p><strong><em>FACT: </em></strong>House construction can affect radon levels. However, radon can be a problem in homes of all types: old homes, new homes, drafty homes, insulated homes, homes with basements, and homes without basements. Local geology, construction materials, and how the home was built are among the factors that can affect radon levels in homes.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> Radon is only a problem in certain parts of the country.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> High radon levels have been found in every state. Radon problems do vary from area to area, but the only way to know your radon level is to test.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> A neighbor's test result is a good indication of whether your home has a problem.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> It's not. Radon levels can vary greatly from home to home. The only way to know if your home has a radon problem is to test it.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> Everyone should test their water for radon.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> Although radon gets into some homes through water, it is important to first test the air in the home for radon. If your water comes from a public water supply that uses ground water, call your water supplier. If high radon levels are found and the home has a private well, call the Safe Drinking Water Hotline at 1-800-426-4791 for information on testing your water.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> It's difficult to sell homes where radon problems have been discovered.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em></strong> Where radon problems have been fixed, home sales have not been blocked or frustrated. The added protection is some times a good selling point.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> I've lived in my home for so long, it doesn't make sense to take action now.</strong></p>
    <blockquote>
      <p><strong><em>FACT: </em></strong>You will reduce your risk of lung cancer when you reduce radon levels, even if you've lived with a radon problem for a long time.</p>
    </blockquote>
    <p><strong><em>MYTH:</em> Short-term tests can't be used for making a decision about whether to fix your home.</strong></p>
    <blockquote>
      <p><strong><em>FACT:</em> </strong>A short-term test, followed by a second short-term test* can be used to decide whether to fix your home. However, the closer the average of your two short-term tests is to 4 pCi/L, the less certain you can be about whether your year-round average is above or below that level. Keep in mind that radon levels below 4 pCi/L still pose some risk. Radon levels can be reduced in most homes to 2 pCi/L or below.</p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p align="center"><img src="_images/CA-3.jpg" width="520" height="207" /></p>
    </blockquote>
      </div>
      <div id="footer">
        <p align="center"><strong>© 2009 XL Designs Online - All Rights Reserved </strong></p>
      </div>
    <!-- end #container --></div>
    <script type="text/javascript">
    <!--
    swfobject.registerObject("FlashID");
    //-->
    </script>
    </body>
    </html>
    And here is my CSS if needed,
    @charset "utf-8";
    body  {
         font: 100% Verdana, Arial, Helvetica, sans-serif;
         background: #666666;
         margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
         padding: 0;
         text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
         color: #000000;
    .twoColFixLtHdr #container {
         width: 950px; /* the auto margins (in conjunction with a width) center the page */
         border: 1px solid #000000;
         text-align: left; /* this overrides the text-align: center on the body element. */
         margin-top: 20px;
         margin-right: auto;
         margin-bottom: 20px;
         margin-left: auto;
         background-color: #557050;
    .twoColFixLtHdr #header {
         border-bottom: 1px solid #000000;
         height: 250px;
         background-color: #DDDDDD;
         padding-top: 0;
         padding-right: 10px;
         padding-bottom: 0;
         padding-left: 20px;
         background-image: url(../_images/homebanner1.png);
    .twoColFixLtHdr #header h1 {
         margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
         padding: 20px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
         text-align: center;
         font-size: 48px;
         font-family: Tahoma, Geneva, sans-serif;
         color: #000;
    .twoColFixLtHdr #sidebar1 {
         float: left; /* since this element is floated, a width must be given */
         width: 200px;
         border-right: 1px solid #000000;
         background-color: #557050;
         padding-top: 0px;
         padding-right: 10px;
         padding-bottom: 15px;
         padding-left: 10px;
    .twoColFixLtHdr #mainContent {
         margin-top: 0;
         margin-right: 0;
         margin-bottom: 0;
         margin-left: 250px;
         padding-top: 0;
         padding-right: 20px;
         padding-bottom: 0;
         padding-left: 20px;
         text-align: left;
    .twoColFixLtHdr #mainContent h1 {
         font-size: 48px;
         font-family: "Arial Rounded MT Bold";
         font-weight: bold;
    .twoColFixLtHdr #mainContent h2 {
         font-family: "Arial Rounded MT Bold";
         font-size: 32px;
    .twoColFixLtHdr #mainContent h3 {
         font-family: Georgia, "Times New Roman", Times, serif;
         font-style: italic;
         color: #CF0;
         font-size: 125%;
    .twoColFixLtHdr #mainContent h5 {
         font-size: 120%;
    .twoColFixLtHdr #footer {
         padding: 20px 10px 20px 20px;
         border-top: 1px solid #000000;
         background-color: #A3A3A3;
         font-family: Arial, Helvetica, sans-serif;
    .twoColFixLtHdr #footer p {
         margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
         padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
    .fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
         float: right;
         margin-left: 8px;
    .fltlft { /* this class can be used to float an element left in your page */
         float: left;
         margin-right: 8px;
    .clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
         clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    #paragraphFloat {
         width: 350px;
    #paragraphFloat2 {
         width: 350px;
    Please if anyone knows what I'm doing wrong please please let me know!  Since I am learning, I really want to get main concepts like this down so I am not constantly doing things the hard way!  Thank you! 
    Jayson

    1) Regarding validation, what does it do?
    It validates by telling you where your code isn't er... valid.  Sometimes the results are a bit jumbled but if you work through them one at a time and revalidate, it's a good way to learn.  If you fix all of the errors shown up through the validator you should end up with standards compliant code.  Not necessarily the best, most efficient code you can write but at least it will be valid and it helps you spot errors that hours of code-staring never seems to find.
    I don't use the DW validation tool because I find the W3c one easier.
    The W3c validator has a check box of HTML Tidy which can tidy up your code but it's not always as easy to see what changes.
    2) I know the <p> tag for spacing is wrong, I could just feel it in my bones.  I just didn't know what else to do.  If I <br> all the way down won't the code be just as cluttered?
    You're obviously a born web coder!
    <br> will bloat your page if you use them to position elements.
    Here you need to get used to a) the Block Model and b) CSS positioning.  Once you crack these, CSS opens up for you and becomes a little more intuitive.
    if you have two elements on top of each other rather than push them apart with other elements you do it with padding and/or margin.  There are things to watch out for here namely, collapsing margins but if you start to read up on the above, you'll get it.
    I just thought of something.  If I add a div in main content, align it to the bottom center with CSS, use a line break between it and the text above, and add the image in question in the new div, will the spacing between the text and image work itself out?  I just really want to get out of the <p> bad habit.
    Keep thinking!  Web design is not like desktop publishing or print.  Elements on a HTML page don't behave like paragraphs on a page.  Once you begin to figure out why not it all gets a little easier.
    If you want an image at the bottom an element you put that at the end of the content in that element.  Then you need to ensure there is no margin, padding or border between the img element and the next element (your footer).  HTML elements come with some styling that is applied by default in the browser.  Many web developers include a rule like this:
    body {
    margin: 0;
    padding:0;
    This sets the margin and padding to zero of course and it's purpose is to override the defaults.  Some people advocate applying similar rules to all elements and if your interested try googling Eric Meyer who has written about it online.
    One of the key purposes of CSS is to take styling out of the page.  It's leaner, more efficient for the viewer and the coder and helps with site management.
    3) AP divs are weird, and I did only use as a last resort.
    See? You're a natural!
    The reason is I am confused by the float and clear float classes.  My left column is floated left and that element is what I was having problems understanding.  I tried to make new divs and float right but I screwed it all up.  I am sure I am just not applying the clear float in the right places.
    Getting the hang of floating is key to CSS positioning.  You use a float if you want two elements to sit side by side on the page.  It disrupts the "document flow."  Ordinarily HTML elements are rendered one after the other, on top of each other.  Floating an element takes it out of the document flow and allows other elements to occupy its space.  When you float an element it should always have a width.  If the element below it also has a width, that width has to be sufficiently narrow to allow it to occupy the space.  In short, floated elements can't be wider than their containing element.
    The clear property is used after a float to stop an element occupying the space left by a floated element.  It works but confuses the heck out of me!
    So that leads me to my final point.  I am a novice too!  I might have fluffed a few of the technical points above but it's pretty much there.
    Regards
    Martin

  • Need Help Centering Page Content

    Hi, I have added a white box behind my main page content but the content is not centered within the box. It seems to be on the left. There are a number of different style sheets and I need to find out which style is affecting how the content is positioned.
    1. In this link below I’m not sure what is making the content go to the “left”. I need all of the thumbnails to be centered in the white area. That is what I need to find out first. What is the best way to find what is causing the thumbnails to go to the left? Is there an easy way to narrow down what is causing the thumbnails to go to the left?
    If I select “ul.work li” I notice it is set to (float: left). If I change it to (float: right) the thumbnails all move to the right. but if I set it to (float: none) the thumbnails all line up vertically. Not what I want.
    http://www.buzzfx.ca/2d_character.html
    In the homepage I also need to have all of the content centered.
    http://www.buzzfx.ca
    2. Also, how would I move the white box up to align with (touch the bottom) of the grey header?

    Thanks John, I managed to watch a good tutorial that set me straight.
    So back to the initial question. I am trying to center the content in the body but it seems to be aligned "left". Using Firebug, I think I have found the part that needs changing.
    1. At this link: http://www.buzzfx.ca/2d_character.html
    2. I hovered over the thumbnails until I found: <ul class="work fullwork clearfix">
    3. I then looked in the style and I believe it is this code below in "bold italics" that I need to edit to get the "content" to be centered but I am not sure how specifically to fix it/
    Q. Why does "margin-left: 40px;" have a strike through it?
    Q. Is "margin-left: 40px;" the reason the content is aligned "left"?
    Q. Could I not just "center" the contents instead of have it positioned from the "left"? Please explain!
    I would be very grateful if someone could look at my page in Firebug to tell what the best way is to center the body content.
    .clearfix:after {   clear: both;
       content: ".";
        display: block;
        height: 0;
        line-height: 0;
        visibility: hidden;
    ul.work {
    margin: 0 -15px;
    ul, ol {
    margin-left: 40px;
    h1, h2, h3, h4, form, table, ul, ol, p, dl, blockquote, hr {margin-bottom: 30px;
    text-align: left;
    ol, ul {
    list-style: none outside none;

  • Need Help Centering Page in Browser Window

    I'm designing my pages by creating a graphic framework in
    Photoshop, slicing and exporting images into css using Fireworks to
    a Dreamweaver html page. These pages look great; but they load into
    the upper left corner of the browser window
    I was taking a Dreamweaver class at the Denver Art Institute,
    that was worthless. I dropped the class after the 4th week and am
    now teaching myself. I asked the teacher how to center this kind of
    page in a browser window, so the page would behave like most
    webpages, centering as you change the width of the browser window.
    I also wanted to add a repeating pattern in a background image. She
    told me that she didn't know how, that I would have to build the
    background into my Photoshop file. So, that's what I've been doing.
    However, when people with smaller monitors change pages within a
    site the built-in background requires them to recenter the page
    manually each time.
    Is there a way to center the page and add a background image
    that is not built in? I've tried using Dreamweaver's background
    image and margins in the Page Properties; but that just pushes the
    page to the upper left and adds the background to the right and
    bottom of the page.
    Please visit:
    http://www.livingwater.la,
    http://www.renegadegraphics.biz
    and
    http://www.dentalmatchmakers.net
    for examples.
    Thanks for your help.
    Mary

    >I was taking a Dreamweaver class at the Denver Art
    Institute, that was worthless
    Yes, those classes usually are worthless because they focus
    on using the tool without giving you the proper foundation for
    understanding and managing html and css. Unfortunately, all of the
    example sites you gave you AP Divs (layers) as a primary layout
    method, which is a terrible approach. AP Divs should be used rarely
    if ever, and only when you understand how they work. When the
    visitors font is sized differently than you expected, the site
    falls apart. The correct approach is to learn web
    design/development outside of the context of a specific
    application.
    http://www.w3schools.com/html/
    is a good place to start for a basic understanding of html and css.
    And some basic layout techniques can be found here:
    http://apptools.com/examples/pagelayout101.php

  • Need help with overlaying divs

    I want a top nav bar within the (top) banner. I am doing this by putting a div (#toplinks) within the banner div (#banner).
    But I want a bottom allignment on that nav bar.  When I give it a top margin to push it down, it pushes the banner down.
    #wrapper {
        height: 552px;
        width: 850px;
    #banner {
        height: 136px;
        width: 850px;
        position: relative;
    #toplinks{
         height: 30px;
         width: 850px;
    #wrapper #banner #toplinks ul li {
        list-style-image: none;
        list-style-type: none;
        display: inline;

    Your really not "Overlaying divs"
    What you may want to do is make the Banner a background image.
    In any case the way I would structure this ike so:
    <div id="header">
    <div class="top-links">
    <ul>
    <li><a href="/">Link One</a></li>
    <li><a href="/">Link Two</a></li>
    <li><a href="/">Link Three</a></li>
    </ul>
    </div><!-- / top links / -->
    </div><!-- / header / -->
    The banner being a graphic should have a container I'm calling the container header use CSS background image for the header div.
    Just my way others may chime in.
    Shane

  • Need help centering page

    This page is just a baby but I'd like to get this figured out
    before i get to deep into it. It's in php but only the swf menu at
    the top is the consistent thing. the menu at the top will center.
    the background and the sidebar will not. here is the code and a
    link so you can see what I'm talking about.
    www.mmdup.com/newindex.php
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN" "
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="
    http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    charset=UTF-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    <!--
    body {
    text-align:center;
    background-image: url(images/mmdcombkg.jpg);
    background-color: #000000;
    background-repeat: no-repeat;
    margin-top: 0px;
    width:800;
    margin-left: auto;
    margin-right:auto;
    background-position: auto;
    text-align: center;
    -->
    </style></head>
    <body><?php include("menuhead.html"); ?>
    <img src="images/bannerline.png" width="1000" height="5"
    />
    <table width="191" height="533" border="0"
    cellspacing="0">
    <tr>
    <td bgcolor="#779993"> </td>
    </tr>
    </table>
    </body>
    </html>
    Thanks for any advice.

    Here try this code
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN"
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="
    http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    charset=UTF-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    <!--
    body {
    background-image: url(images/mmdcombkg.jpg);
    background-color: #000000;
    background-repeat: no-repeat;
    margin-top: 20px;
    #wrapper {
    width:1000px;
    margin:0 auto;
    background-color:#CCC;
    #main {
    width:1000px;
    height:500px;
    background-color:#CCC;
    -->
    </style>
    </head>
    <body>
    <div id="wrapper">
    <meta http-equiv="Content-Type" content="text/html;
    charset=UTF-8" />
    <object
    classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
    codebase="
    http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0"
    width="1000" height="248" title="menu">
    <param name="movie" value="bannermenu.swf" />
    <param name="quality" value="high" />
    <embed src="bannermenu.swf" quality="high"
    pluginspage="
    http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash"
    type="application/x-shockwave-flash" width="1000"
    height="248"></embed>
    </object>
    <div id="main">
    <p>Some text here</p>
    </div>
    </div>
    </body>
    </html>
    aka Frenchy ASP
    "vidfix55" <[email protected]> wrote in
    message
    news:[email protected]...
    > This page is just a baby but I'd like to get this
    figured out before i get
    > to
    > deep into it. It's in php but only the swf menu at the
    top is the
    > consistent
    > thing. the menu at the top will center. the background
    and the sidebar
    > will
    > not. here is the code and a link so you can see what I'm
    talking about.
    > www.mmdup.com/newindex.php
    >
    > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN"
    > "
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    > <html xmlns="
    http://www.w3.org/1999/xhtml">
    > <head>
    > <meta http-equiv="Content-Type" content="text/html;
    charset=UTF-8" />
    > <title>Untitled Document</title>
    > <style type="text/css">
    > <!--
    > body {
    > text-align:center;
    > background-image: url(images/mmdcombkg.jpg);
    > background-color: #000000;
    > background-repeat: no-repeat;
    > margin-top: 0px;
    > width:800;
    > margin-left: auto;
    > margin-right:auto;
    > background-position: auto;
    > text-align: center;
    > }
    > -->
    > </style></head>
    >
    > <body><?php include("menuhead.html"); ?>
    > <img src="images/bannerline.png" width="1000"
    height="5" />
    > <table width="191" height="533" border="0"
    cellspacing="0">
    > <tr>
    > <td bgcolor="#779993"> </td>
    > </tr>
    > </table>
    >
    > </body>
    > </html>
    > Thanks for any advice.
    >
    >
    >

  • Why aren't my CSS and div tag boxes displaying the background images I'm plugging in?

    I'm using the CSS dialog boxes to places images via the background image option into my dreamweaver site. Everything looks fine in dreamweaver but when I view it any of the browsers, two of the images I've place as div tag background images don't work....the overal background image of the site works, but these don't show up ....
    here's my code if it helps to answer
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Main</title>
    <style type="text/css">
    body {
    background-image: url(images/realgrade.jpg);
    background-repeat: repeat-x;
    text-align: center;
    html, body {
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-top: 0px;
    padding-top: 25px;
    #wrapper {
    width: 930px;
    text-align: left;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    position: relative;
    background-image: url(file:///Macintosh%20HD/Users/jimmymoreira/Unnamed%20Site%204/images/possible%20image. jpg);
    background-repeat: no-repeat;
    #header {
    height: 192px;
    width: 237px;
    background-image: url(images/logo_fill.jpg);
    background-repeat: no-repeat;
    position: absolute;
    left: 35px;
    top: -25px;
    #mainNav {
    background-color: #33F;
    height: 200px;
    width: 272px;
    float: left;
    margin-top: 233px;
    #maincontent {
    height: 600px;
    width: 608px;
    float: right;
    margin-bottom: 45px;
    padding-right: 25px;
    background-repeat: no-repeat;
    background-position: center 270px;
    background-image: url(file:///Macintosh%20HD/Users/jimmymoreira/Unnamed%20Site%204/images/opaqueMaincontent .png);
    #sidebar {
    background-color: #F36;
    height: 250px;
    width: 272px;
    clear: left;
    float: left;
    #footer {
    height: 525px;
    width: 870px;
    clear: both;
    padding-top: 45px;
    padding-right: 30px;
    padding-bottom: 30px;
    padding-left: 30px;
    background-image: url(images/footer_image.jpg);
    background-repeat: no-repeat;
    margin-top: 45px;
    </style>
    </head>
    <body>
    <div id="wrapper">
      <div id="header">
        <p> </p>
        <p> </p>
        <p> </p>
      </div>
      <div id="mainNav">
    <p> </p>
    </div>
      <div id="maincontent"></div>
      <div id="sidebar"></div>
      <div id="footer"></div>
    </div>
    </body>
    </html>
    here's what I'm going for
    here's what I'm getting in the browser
    Please help!

    Your image files are pointing to your hard drive, not your server.  You have this
    background-image: url(file:///Macintosh%20HD/Users/jimmymoreira/Unnamed%20Site%204/imag es/opaqueMaincontent.png);
    and you should have this
    background-image: url(imag es/opaqueMaincontent.png);
    Also, is your images file named imag es?
    Gary

Maybe you are looking for