Forum Moderators: not2easy
I am having to put in to my code (XHTML) DW edit tags
As I am now building sites with CSS layout I have run into problems with these tags clashing with DIVs, mostly it seems because I am using so many more DIVs than with my old table layouts..
I use to put these tags either outside the tables entirely or just inside each table cell (td)
Can anyone shed any light?
ZA
ps I was in two minds as to post this one here or in browser forum... sorry if I made the wrong choice..
The first example will place the div with a class of "mydiv1" to be at 10px from the left and top without any exception.
div.mydiv1 {
left: 10px;
position: absolute;
top: 10px
}
"mydiv2" below will be placed 10px from the bottom and right of whatever container (another table or div for example) it is contained within.
div.mydiv2 {
bottom: 10px;
position: relative;
right: 10px
}
_____
This last example shows you not only positioning of X and Y but also Z. The higher the value of z-index the closer the object is to the viewer. If two items have the same absolute positioning then then an item with a z-index of ten will appear on top of or completely over another object with a z-index of 9.
img.image1 {
height: 10px;
left: 10px;
position: absolute;
top: 10px
width: 10px;
z-index: 1;
}img.image2 {
height: 10px;
left: 15px;
position: absolute;
top: 15px
width: 10px;
height: 10px;
left: 10px;
position: absolute;
top: 10px
width: 10px;
z-index: 2;
}
Use this code in a blank page, save it to a folder with a couple images, like image1.gif and image2.gif (change to jpg or whatever).
<html>
<head>
<style>
img.image1 {
height: 100px;
left: 100px;
position: absolute;
top: 100px
width: 100px;
z-index: 1;
}img.image2 {
height: 100px;
left: 125px;
position: absolute;
top: 15px
width: 10px;
height: 50px;
left: 125px;
position: absolute;
top: 100px
width: 100px;
z-index: 2;
}
</style>
</head><body>
<img src="image1.gif" alt="" class="image1" />
<img src="image2.gif" alt="" class="image2" />
</body>
</html>
I haven't used DW in many years, but I think the answer to that one is that it depends on whether you want the person editing the pages to be able to change the div itself (then go outside the <div></div> tags) or just to edit the div's content (then go inside the <div></div> tags.
Sorry if I mis-read the question.
sorry if I wasted your time thankyou both, tedster what you said was what I was on about, and actually you made me go back and examine my code in more detail
Only I have just found the root of the problem,
I input all my edit tags on the the page thus
<!-- #Beginzzzz "Edit" -->
<!-- #Endzzzz -->
then seach and replace later replacing 'zzzz' with 'Editable' - DW only replaces the first set, dont know why - but I suppose this is a good reason to use notepad...
I use DW for the basic color variations in code, I write all CSS and most XHTML by hand, but if you have better suggestions for this would be open, but I need site wide search and replace tools
thanks again for the help
ZA
