Dreamweaver Tutorials back to dreamweaver tutorials home pagee contact form tutorial page
A value is required.Invalid format.A value is required.Invalid format.
Social Networks Our YouTube.com Channel Facebook Page

Copy Div Tags and Attributes from one page to another.


Share this Dreamweaver Article:

Ok, were going to by copying div tags from one page in dreamweaver to another.

I have created a div tag called ‘linksbox’ and inside that div tag are five other div tags, all with their own ID:

div tag attributes example


Footerbox1
Footerbox2
Footerbox3
Footerbox4
Footerbox5










So the code for the ‘linksbox’ div tag would be:   

<div id=””>linksbox</div>


And the code for ‘footerbox1' would be:   

<div id=”footerbox1”></div>

Each footer box has its own number which identifies them as individual div tags.  I have set a height and width for each div tag for visual representation and it also helped me to float the div tags in order for them to be lined up side by side.

So, I recommend copying your CSS styles to the new page that you are going to copy these div tags to.  That way when you copy and paste the code for the div tags they should all take up the styling from that CSS file.  Otherwise we would have to style each of these individually.  I haven’t created a template for this page either.

So if we have a look inside of code view we can see the code for the structure of the linksbox div tags and all of the tags that are inside of it:

links box div tag in dreamweaver image

Now, highlight all of the code and copy it then go over to your new page and paste it into your new document and you will find that all of the CSS attributes have been integrated with it.  If you have a look at the bottom of this page you will see the very same linksbox that has been created in this tutorial.  Why don’t you have a look at the code by going to View>page source from your browser window.

So why is it useful to know how to copy div tags from one page to another?  Well, if you have not created a template or you like a design element from a particular page you have created, you can save yourself a lot of time hand coding by simply copying the div tags and CSS over to your new page.

I hope you have enjoyed this Dreamweaver Tutorial: copying div tags from one page to another.



For A Dreamweaver CS4 Video Tutorial explaining how to use the above techniques please follow this link:

Copying Div Tags and Attributes in Dreamweaver CS4



blog comments powered by Disqus

Dreamweaver Website Templates

Web Hosting Plans That I Use

  • GoDaddy.com Hosting Plans!Godaddy Hosting
  • Unlimited Hosting at HostGatorHostGator Hosting
  • JustHost.com Unlimited DomainsJustHost Hosting
  • Hosting just $4.88/month! - PowwebPow Web Hosting

PHP Luxury Contact Form Tutorial


Great Premium Shopping Cart

  • BigCommerce makes it easy to sell online. Click here to try it free!BigCommerce

    I highly reccommend this product for people who want to create an online store. it's easy to set-up and add products to and easy to manage back-of-house. Can also be used as an Ebay store.

Email Marketing - Recommended links

CSS Drop Down Menu - Dreamweaver

Floating Menu - Dreamweaver

Tabbed Navigation Menu

CSS Text Boxes in Dreamweaver

CSS 3 in Dreamweaver

J Query in Dreamweaver

Transparent Overlays Dreamweaver

CSS in Adobe Dreamweaver

All Types of Links In Dreamweaver

Positioning Elements in Dreamweaver

Unordered List Images Dreamweaver

Create an RSS Feed in Dreamweaver

Website Typography in Dreamweaver

Expanding Text Boxes - Dreamweaver

Make a Donation

Donate for Dreamweaver Tutorials