I'm working on this website - http://soleproductions.com/virgilcardin/index.htm
I want to position the "7 Days a Week" waterdrop image just to the right of "Call Us Today..." text.
Here is my logic....
I created a div called "7daysaweek" and placed it inside the "largeimage" div and set the "largeimage" div to Relative so I could use absolute positioning of the "7daysaweek" div and set 7days div to 0 bottom, 0 right but it remains at the top left corner of the largeimage div. What am I missing?
Here is my HTML
<div id="7daysaweek"><img src="../images/7-days-a-week.png" width="114" height="178" alt="7 Days a Week" /></div>
Here is my CSS
In design view, DW shows it at the bottom right of the largeimage div (where I want it) but when I look at it in Live View or within IE or Firefox, it is positioned at the top left corner of the largeimage div.
I've watched a few css positioning tutorials and I believe I am understanding how absolute and relative positioning works but just can't get it to work on my end. It's probably somethings super simple but I'm apparently not seeing it. Any help would be greatly appreciated.
Design View isn't reliable. Use Live View or Preview in browsers.
Leading numbers like "7" are not allowed in CSS selector names. The selector name must begin with a letter.
Try this (inline styles used here for expediency):
<div id="waterDrop" style="position:absolute; top:22px; left: 800px"><img src="images/7-days-a-week.png" alt="7 Days a Week" height="178" width="114">
Thanks John and Nancy. Nancy, you were correct. I simply renamed the 7daysaweek div to waterdrop and now it is allowing me to position it. I didn't realize I could not use numbers. Thank you kindly
Europe, Middle East and Africa