Well i was trying to position two images differently using internal css but they are responding two any one image style. Any suggestions?.
Please provide more details so that we can answer your question. may be an image of what you would like to see would be good.
Sorry i'm not sure that i understand you clear. But this is)) Two background on one page. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Two BackGrounds</title> <style> html { background: #fc0 url(images/bgleft.png) repeat-y; height: 100%; } body { background: url(images/bgright.png) repeat-y 100% 0; margin: 0; height: 100%; } p { margin: 0; padding: 5px 0 0 20px; } </style> </head> <body> <p>some text for website</p> </body> </html>
First of all, it's called an INLINE style, and not internal. Anyways.... When you put like <img src="somerandomurl.png" id="randomid" class="randomclass" alt="Some Alternative /> , the image will inherit all defined options from "img {}" in CSS, and then if the same are defined in class or id, they'll get overwritten. For example : CSS : img { border: none; } #imageone { border: 1px solid #000; } .imageone { border: 1px solid #fff; } HTML <img src="random.png" alt="" /> ==> This image won't have a border <img src="random.png" alt="" class="imageone" id="imageone" /> ==> This image will have a WHITE border 1px thick because .imageone overwrites img and #imageone overwrites .imageone. <img src="random.png" alt="" id="imageone" class="imageone" /> ==> This image will have a BLACK border 1px thick because #imageone overwrites img and .imageone overwrites #imageone. Hope it helps!!
I think, if you have a background image on both the html + body elements they should both show, but you have width set to 100% for both elements, therefore one obscures the other.