How do I layer a transparent GIF over an Image in Dreamweaver CS4?

Hi There,





I have tried using AP divs to layer the images and this works fine except when the website is previewed and the browser window is resized, the top image is fixed on the page and does not move with the other elements.





I tried changing the AP div position to ';static'; but that won't allow me to layer it.





Please Help! Many ThanksHow do I layer a transparent GIF over an Image in Dreamweaver CS4?
An example would help here but I still got some insight on the problem.





You've already noticed the problem with using AP divs, but its not totally fair to say its a problem. AP div's are great tools for a website the only draw back is that AP divs don't mix well with normal divs and tables.





I don't know exactly what your doing here but the only good solution that I see is to make the the entire site AP divs. Now thats alot of work so maybe you can still use your tables but in the end your going to have to ';nest'; these AP divs.





For an example, the picture you want to cover is placed inside div1, div1 is nested inside a div with an id or container. Because its nested inside this container it uses it as its boundry not the browser like you were running into. Now all you need to do is put your trancperacy in something like div2 and position it over the other div. Just give it the same coordinats (left, right, top ect...).





To do this create a new AP div and call it container, then you need to do a hidden step that dreamweaver kinda hides. You need to go to EDIT %26gt; PREFERENCES %26gt; AP ELEMENTS and then check the NEST when created within an AP div checkbox. Now any AP div you drag and create inside this container div uses its boundrys not the browsers.





Here is the code for my container, don't use it because it won't allow nesting unless you make it your self but look at it for help...





#container {


height: 1200px;


width: 750px;


margin-right: auto;


margin-left: auto;


background-color: #FFF;


position: relative;


text-align: left;





NOTICE that the AP div is positioned relative with a right and left margin of auto. All of these combined makes the div center itself in the browsers window. NOW all the AP divs that are put inside here will have a position of absolute.





If you need more help check out w3schools.com they have in depth demos and code for you there.