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

Similar Messages

Using the CSS tab, how do I make the background image stretch as.....

... as opposed to repeat.
Thanks!

"motleyscrewed" <[email protected]> wrote in
message
news:gan8i5$6t9$[email protected]..
> ... as opposed to repeat.
Are you talking about a real image in the markup (an img
"tag") or about a
background image?
Background images do not stretch, real images will resize to
whatever
dimensions you set for them in the styles sheet.
As a side note, IE has a filter that allows "background
images" (note that
they are not really background images) to stretch (Google
"AlphaImageLoader
scale").
Thierry
http://www.TJKDesign.com/go/?0
| Articles and Tutorials
http://divahtml.com/products/scripts_dreamweaver_extensions.php
| Extensions
that keep your markup clean
http://webassist.com/professional/products/productcategory.asp?CID=8
| CSS
Sculptor, CSS Menu Writer, etc

HT201365 So where is Find My Iphone on my device? Or is it like the Podcast app that I had to download when podcasts got removed from the music app? Why aren't these necessary (and free) apps included with the upgrade?

Ok

Hi Jim1234567,
Find My iPhone is available from the App Store here:
Find My iPhone
https://itunes.apple.com/us/app/find-my-iphone/id376101648?mt=8
Take care,
- Ari

I just purchased a mac air. Why aren't numbers, keynote and pages free, I just purchased a mac air. Why aren't numbers, keynote and pages free

I just purchased a mac air in Feb 2014. Why aren't numbers, keynote and pages available for free download?

kizoby wrote:
I just purchased a mac air in Feb 2014.
See Here > http://www.apple.com/creativity-apps/mac/up-to-date/

Why aren't my iPad and iPhone syncing on iCloud?

Why aren't my iPhone and iPad syncing on iCloud? All settings are on.

settings->icloud
and
settings->itunes & app stores
make sure the correct appleid is set if not logout and login with the correct

Dw, css, and a template, what is the best way to create a 20 page website with a different header in each page?

dw, css, and a template, what is the best way to create a 20
page website with different header content on each page? i am
trying to insert a specific image and background color for each
header on every page. what is the easiest or best way to do this?
thanks, bryan

"mediastream13" <[email protected]> wrote in
message
news:f47bes$9om$[email protected]..
> ok, murray, here is the site.
http://www.helphotline.org
> in I.E. 6 i can't see the background color behind the
header images,
I'm seeing a hot pink background (which is my browser default
- so that I do
remember to declare a background color). You need to add:
body { background-color: white;} to your stylesheet, or into
the imbedded
styles on your page.
In Firefox, the very top black section, #headertop is hidden
behind the
header image.
> background of the date/time isn't stretching the full
length of the
> screen, and
> the margins aren't working in the main content area. how
can i put a
> background
> color behind the header images?
I can see the header image stretching right across the page..
so not sure
what color is missing there.
> is there anyway to download i.e. six on my computer if i
already have
> i.e.7? i
> just want to be able to preview the site before i upload
the changes. it
> seems
> everything works in i.e. 7.
Yes, I used this and it works really well.
http://tredosoft.com/Multiple_IE
Nadia
Adobe® Community Expert : Dreamweaver
CSS Templates |Tutorials |SEO Articles
http://www.DreamweaverResources.com
~ Customisation Service Available ~
http://www.csstemplates.com.au

Why aren't my photos uploading to my pc from the photo steam? I'm using Windows Vista

Why aren't my photos uploading to my pc from the photo steam? I'm using Windows Vista

I don't think Vista will work
MINIMUM System requirements for Cloud Programs... scroll down and check each program
-http://helpx.adobe.com/creative-cloud/system-requirements.html

Why does FireFox open as a very small box in the top l/h corner and i have to resize it every time

Why does FireFox open as a very small box in the top l/h corner and i have to resize it every time this only occurs on the initial opening up of F/Fx after boot-up

Open the system menu via Alt+Space and see if you can resize that window.<br />
If that works then close Firefox (File > Exit/Quit) to save that setting.
See also:
* http://kb.mozillazine.org/Resizing_oversize_window
If the above didn't help then see:
* http://kb.mozillazine.org/Corrupt_localstore.rdf

My iPhone says "o death" where the date should be on the lock screen, why is it doing this and how do I get the date back?

My iPhone says "o death" where the date should be on the lock screen, why is it doing this and how do I get the date back?

I tried powering off and on and it went away, but I can't tell if it's been broken into since everything works fine (I'm using it now) is there a test to see if it's been broken into?
Thanks for all your replies!

Want new tab to open to home page and why does firefox not have a simple check box in the options because I can't keep going through a long procedure each time

I want new tab to open to home page and why does firefox not have a simple check box in the options because I can't keep going through the long tedious procedure each time I install firefox. It is something that should be in the options tab , and I want to know why it isn't. I am totally frustrated with firefox and getting ready to switch.

You can use the SearchReset extension to reset some preferences to the default values.
*https://addons.mozilla.org/firefox/addon/searchreset/
Note that the SearchReset extension only runs once and then uninstalls automatically, so it won't show on the "Firefox > Add-ons" page (about:addons).
If you do not keep changes after a restart or otherwise have problems with preferences, see:
*http://kb.mozillazine.org/Preferences_not_saved

Why am I having issues with the background image here?

body {
    text-align:left;
    font-family:Tahoma, Geneva, Helvetica, Arial, sans-serif;
    font-size:11px;
    line-height:17px;
    color:#8a8683;
    margin:0;
    padding:0;
* html body {
    overflow:hidden;
* html div#content {
    height:100%;
    overflow:auto;
div#colBg2 {
    width:519px;
    height:100%;
    margin:0 0 0 449px;
    background:url(/images/colBg2.png) repeat-y top;
    z-index:600;
table#colText {
    height:100%;
    width:433px;
    text-align:left;
    z-index:700;
<div id="colBg2">
<div id="colText">
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum.</p>
</div>
</div>
What this is supposed to do is show background image colBg2.png as a column extending from the top of the viewport to the bottom, whether there's enough text to fill it or not. If it doesn't, then it shouldn't produce a scrollbar. It uses 100% vertical height hacks, as demonstrated in the code above.
When there's more text than the viewport can handle, there's a scrollbar, and the colBg2 successfully scrolls along with the text contained in colText. HOWEVER... when that background scrolls upwards so we can go down the page, it stops tiling. It stops wherever the viewport ends.
If I stretch the window to reveal more of the column, no problem. It tiles just fine, and extends all the way to the end of the screen. But not if I scroll down.
Anyone know if I'm doing anything wrong with this code, or if there's an obvious fix that isn't occuring to me?

I was just about to prepare that for you guys when I had a quick flash to try applying the background image directly to the table instead
of a containing div. I'm sure there was a reason I used a containing div to begin with, but can't for the life of me remember why right now. I'm sure it'll hit me at some point and I'll probably be back here when it does, but so far eliminating the containing div altogether has produced the desired effect. =)

How do I make a 20 X 30 print with layers of 16 X 20, 12 X 18, 11 X 14, 8 X 12, 8 X 10, 5 X 7 and 4 X 6 of the same image to display the different sizes available to someone? Using Elements 13 with Windows 8.1

How do I make a 20 X 30 print with layers of 16 X 20, 12 X 18, 11 X 14, 8 X 12, 8 X 10, 5 X 7 and 4 X 6 of the same image to display the different sizes available to someone? Using Elements 13 with Windows 8.1
A senior citizen needs some help.
Thanks

Saving each image as different size - is it an option for you? I would save images with their name as: 20x30.png, 16x20.png etc etc.
Or explain whether you want these in a webpage in which case only one image is necessary and different sizes are displayed with good CSS code. this is question for Dreamweaver forum if this is what you want.

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.

Safari does not display my background-image from my CSS

I am creating a web site in which I want an image to be seen in the backgound with the text "floating" over it. The code is listed below.
/* CSS Document */
a{text-decoration:none}
body {
background-image:url(images3/greywolf1.jpg);
background-attachment:fixed;
background-position:top right;
background-repeat:no-repeat;
height:100%;
The image can be seen in IE, Netscape and Firefox but not in Safari. Is there a trick to this for Safari or does Safari not support this?
You can view the current page I am working on at:
www.killeenisd.org/shoemakerhs/main.html
Thanks for anyy help you can give me.
qtmouser

Thank you. Though there was a closing brace on the body message, I ended up retyping the entire script and it worked.

I want a stamp to write to the file metadata and be able to display the result in windows explorer.

I want a stamp to write to the file metadata and be able to display the result in windows explorer. I have read PDF Stamp Secrets and can write to Custom Metadata but don't know how to display that custom field in explorer. Can I have the stamp write to a standard (non-custom) metadata field? Or, how do it get the custom field to display in explorer? Windows is pretty stingy with the file details it displays for PDF files, in fact there are no editable fields provided (like are available for Office files). I want this to work for multiple users hopefully without having to get the IT group involved to make (or allow) system modifications to make this work. Any ideas? Thank you.

Metadata for Windows Explorer is tagged with different names than the metadata for PDFs. Acrobat cannot copy the metadata to the tagged items of the file header.
There are tools like EXIFTool that can manipulate the data as necessary. Phil Harvey also provides the details about the file types and their metadata tags and values so you should be able to map the tags that need to be updated.

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

Similar Messages

Maybe you are looking for