Add Div to Website Template

Adding a Div Element To Place an Item


A "div" is a handy way to quickly add a picture, animation, form or any other item on one of your pages. Once added you can move the item around on the page easily. The advantage of using a "div" is that you can "layer" the item you are adding over any other page element except for the Flash animation. No item can be placed over the Flash animation unless the Flash is set to be transparent.

Adding a DIV

Step 1 of 3:
First, paste the code you want on your page. Somewhere inside the <!-- CONTENT TABLE --> or <!-- MAIN TABLE -->. Generally your will want to paste the item you wish to add anywhere in the main body of the webpage. Example, let's say you want to add a small picture on the left side on top of the menu. See the example above.

Step 2 of 3:
Add the div code around the picture on the html page.
(you can highlight and copy the code below):


<div id="locator">
<img src="picts/yourpicturename.jpg"><br>
</div>


Step 3 of 3:
Now add the following line to your .css file (called either "coolstyle.css" or "corporatestyle.css"):


#locator { position:absolute; visibility:show; left: 20px; top: 300px; z-index:200; }


Now you can adjust the location by changing the left and top numbers in the code above. NOTE: You can not put any items over the Flash animation. If you can not see your item, it may be hidden underneath. Try moving it around some more.

Allwebco Template Support


Allwebco Template Adding a DIV


Allwebco Web Templates
Complete websites with built in scripts.
AllwebcoDesign.com
Web Site Templates
Free Javascripts
Free scripts for any website or template.
Allwebco-Templates
Web Template Support
Mobile Web Templates
HTML5 / CSS website designs.
AllwebcoDesign.com
Web Site Templates
Shopping Cart Templates
Professional templates with built-in Paypal.
AllwebcoDesign.com



Website Template Support
Website Template Support