The images wont show up on my page, help!

[snowman222]

on my site
www.prestondrumline.webs.com
i have a section for my pics (and a positioning problem that makes it hard to see, other article) but the pics wont show, at best they have the little box with the X in it. so i just took the pictures off.

please help, i dont know what to do.

[6StringGeek]

Can you put the pics and code back up so we can see the code you're using and tell you why it's breaking?

[Major Payne]

Might correct these errors first:

CSS (http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=http%3A%2F%2Fwww.prestondrumline.webs.com%2F)
HTML (http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.prestondrumline.webs.com%2F)

You MUST use a proper DocType (http://www.w3.org/QA/2002/04/valid-dtd-list.html) as you are putting a lot of browsers into Quirks Mode (http://en.wikipedia.org/wiki/Quirks_mode). Linking to an external CSS stylesheet for your pages will help a lot. I didn't see any but the images for webs.com.

Webs.com user (http://paynelessdesigns.webs.com/).

[felgall]

With absolute positioning you will have problems if your visitor's browser is open to a size much different from what you tested with - either there will be a lot of empty space or there will be parts that disappear off the screen. Positioning using floats and margins would allow the elements to reposition if the winfdow size is a lot bigger or smaller.

A bit hard to work out what is stopping images from displaying if the image tags have been rem oved but the most likely causes are that the images have either been uploaded to the wrong place and so the page is looking in a different folder from where the images are to be found OR that you have given the image names different caplitalisation in the name of the file to what you reference it as (Windows is not case sensitive but Linux which is what most of the web runs on is case sensitive).

[snowman222]

ok, i put a pic on, and it doesnt work

:(

[Major Payne]

Where are your image tags calling the images? I don't see any anywhere:<img style="width: XXpx; height: YYpx; border: 0;" src="path to image" alt="Text Description">

[snowman222]

but what goes where? i mean what do i put for the px size and if the folder is on my desktop, dont i have to put the folder name/ image name (or something like that)???

[6StringGeek]

You would put your images on your webserver in a directory...we'll call it 'images' for the example Major Payne gave, and assume that the picture properties show it to be 300px by 200px:

<img style="width: 300px; height: 200px; border: 0;" src="images/mypic.jpg" alt="a pic of my drums">

Just drop that code into the div you want you pics to show up in and make sure the path to the images is correct (ie folder name).

[Major Payne]

You do know how to use the webs.com File Manager right? If not, I can guide you through that, but not in this thread as that is unrelated. Via IM may be better. As already stated, there is a little more to getting your images up and laid out, but proper use of div tags and CSS will "git 'er dun".

[snowman222]

Want to know what's freaking sad? the fact that i am still confused!
so in this code
src="(folder on desktop??)/(pic name??)
right?
o and is it case sensitive?

<img style="width: 300px; height: 200px; border: 0;" src="images/mypic.jpg" alt="a pic of my drums">

[snowman222]

Never Mind, I'll just have the Pics from a site, not a folder.

so I think I got it now. but... how do I add a space in between the Pics and below them?

[6StringGeek]

Never Mind, I'll just have the Pics from a site, not a folder.

so I think I got it now. but... how do I add a space in between the Pics and below them?

There's a bunch of ways to do it...padding is the one that i use.

<img style="padding:10px; width: 300px; height: 200px; border: 0;" src="images/mypic.jpg" alt="a pic of my drums">

[snowman222]

that add 10 px on every side, right?

[6StringGeek]

that add 10 px on every side, right?

Yes. If you needed different padding on different sides you would have to specify it with padding-top:10px; padding-left:5px; etc.

[snowman222]

ok, i understand that now.
is the tag for minimum height min-height:
and would the tag for width be min-width: