Hi Christopher, you've come through off-list but no matter, only problem is that anyone else following the thread won't know of any changes.
First off, you mustn't lose sight of the fact that no-one can see changes that you make to your local files. They must be published to a server for anyone to be able to suggest modifications or corrections. As I can't see your mock-up image, I'll go back to the code that I published as a demo and explain a little of that. I'll put notes in standard comment notation so it doesn't screw up if you view it in Dreamweaver. <!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=iso-8859-1" /> <title></title> <link href="navigationalbar.css" rel="stylesheet" type="text/css" /> <style type="text/css"> <!-- --> body { background-image: url(backgroundforpage10_cr.png); /* This is a modified image, a 5px slice taken from your main backgroundforpage10.png image. It's purpose is to be able to repeat across the width of the screen to fill any whitespace unfilled by the main image. As it is part of the original image it should blend reasonably well */ background-repeat:repeat-x; /* the repeat-x makes the image repeat until it fills the width of the screen */ background-attachment: scroll; height: auto; width: auto; padding: 0; /* padding and margin were set as zero to eliminate the defaults from the browser */ margin: 0; /* so that the image holds its correct position. */ } #wrapper{ /* this is styling for the new div that was created to hold your main backgroundforpage10.png */ background-image: url(backgroundforpage10_cr2.png); /* to remove a step in the transition between this image and the slice applied to the body I trimmed this to remove the border on the right edge simply for demo display purposes */ background-repeat: no-repeat; /* a single image only is required so no-repeat is needed */ padding: 0; /* once again padding and margin set zero to cancel browser defaults for positioning purposes */ margin: 0; } </style> </head> <body> <div id="wrapper"> <!-- This is the start of the new div that was placed to hold the main background image --> <div class="menunavigation"> <div class="contact"> <p>Animator \ Motion Graphics Artist </p> <p>Contact: [EMAIL PROTECTED] </p> </div> </div> <p class="backg"> </p> <p> </p></div> <!-- This is where the wrapper div ends, you will see that it encloses all of the other items on the page --> </body> </html> Your HTML and CSS must be capable of working along with each other, the HTML provides the structure of the page and the 'hooks' to attach the relevant CSS rules. Taken in isolation, neither will provide very much, so simply taking my #wrapper rules may not have had too big an effect. I have attached the 2 modified image files so you can experiment with them rather than try to download them from my demo page. I did not make any changes inside your main CSS file and for now I would suggest setting up all of your css rules in the head area of the page so you can experiment more easily. Once you get fixed with your image layout you should take a deeper look at your css in the file, things like setting pixel heights for text are not generally considered good practice and a line height of 2px is not good. These are items that may give you problems as your page progresses so worth taking care of as soon as your images are sorted out. Duncan On Mon, 23 Jun 2008 23:52:58 +0100, Christopher <[EMAIL PROTECTED]> wrote: > Hello Duncan, I have taken your #wrapper from your CSS and used it on my > page (I am using Dreamweaver) and I don't see it when > I preview locally. The only difference is that I replaced your image > with my mock-up image, also what do you mean by "#wrapper is a div that > encloses the other items on the page" > > Christopher > > Duncan Hill wrote: >> On Mon, 23 Jun 2008 22:33:15 +0100, Christopher >> <[EMAIL PROTECTED]> wrote: >> >> >>> Yeah I applied my mock-up image that should be used as the wrapper and >>> I >>> don't see it, is #wrapper a <div> >>> cause I just put that code as seen below this message under the {body} >>> style. Either way I didn't see my mock up image >>> that I wanted placed on the right showing up. >>> >>> >> Chris, >> >> Unless we all come round to your house we can only experiment with >> what you give us in the way of published files. >> If you look at the code on the example I posted you will see that the >> #wrapper is a div that encloses the other items on the page. >> The thin slice that I took from the tight hand side of your >> backgroundforpage10.png is used to repeat across the page to take care >> of any whitespace that is not covered by your large image. >> Whatever the mock up image is that you want on the right side, it needs >> to be published as a part of the page. >> >> Don't forget, it is only when you publish the files to a server that >> we can see them. >> >> Duncan >> ______________________________________________________________________ >> css-discuss [EMAIL PROTECTED] >> http://www.css-discuss.org/mailman/listinfo/css-d >> List wiki/FAQ -- http://css-discuss.incutio.com/ >> List policies -- http://css-discuss.org/policies.html >> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ >> >> ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
