<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	xmlns:series="http://unfoldingneurons.com/"
	>

<channel>
	<title>Web Design Tutorials &#187; Tables in Dreamweaver CS4</title>
	<atom:link href="http://bestwebdesignz.com/tips/tag/tables-in-dreamweaver-cs4/feed/" rel="self" type="application/rss+xml" />
	<link>http://bestwebdesignz.com/tips</link>
	<description></description>
	<lastBuildDate>Wed, 25 Jan 2012 07:56:39 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.1</generator>
		<item>
		<title>Tables in Dreamweaver CS4</title>
		<link>http://bestwebdesignz.com/tips/dreamweaver/tables-in-dreamweaver-cs4/</link>
		<comments>http://bestwebdesignz.com/tips/dreamweaver/tables-in-dreamweaver-cs4/#comments</comments>
		<pubDate>Thu, 09 Apr 2009 09:19:05 +0000</pubDate>
		<dc:creator>clement</dc:creator>
				<category><![CDATA[Dreamweaver]]></category>
		<category><![CDATA[Dreamweaver CS4 Tutorials]]></category>
		<category><![CDATA[Tables in Dreamweaver CS4]]></category>

		<guid isPermaLink="false">http://bestwebdesignz.com/tips/?p=593</guid>
		<description><![CDATA[Another way of designing layouts in Dreamweaver CS4 is by using tables. We will use this method to create the submenu area within the template. Open template.dwt Delete &#8216;Content for id &#8220;submenu&#8221; Goes Here&#8217; from the &#8216;submenu&#8217; div With the cursor still within the &#8216;submenu&#8217; div insert a table [Insert &#62; Table] with 3 Rows, [...]]]></description>
			<content:encoded><![CDATA[<p>Another way of designing layouts in Dreamweaver CS4 is by using tables. We will use this method to create the submenu area within the template.</p>
<ul>
<li>Open template.dwt</li>
<li>Delete &#8216;Content for id &#8220;submenu&#8221; Goes Here&#8217; from the &#8216;submenu&#8217; div</li>
<li>With the cursor still within the &#8216;submenu&#8217; div insert a table [Insert &gt; Table] with 3 Rows, 1 Column, Width of 201 pixels, border thickness &#8211; 0,  Cell padding &#8211; 0 and Cell Spacing -0. Click OK.<img class="alignnone size-full wp-image-595" title="table" src="http://bestwebdesignz.com/tips/wp-content/uploads/2009/04/table1.gif" alt="Tables in Dreamweaver CS4" width="430" height="411" /></li>
<li>You will see a table appear in the &#8216;submenu&#8217; div.</li>
<li>Select the table [Right click within the table &gt; Select Table] and align it &#8216;Center&#8217; in the &#8216;Properties&#8217; Panel.</li>
<li>Click within the top row of the table and insert the image &#8216;submenu-top-bg.jpg&#8217;</li>
<li>Click within the bottom row of the table and insert the image &#8216;submenu-btm-bg.jpg&#8217;</li>
</ul>
<p>To give the background image to the middle:</p>
<ul>
<li> Click within the middle row</li>
<li>From the Properties panel, select &lt;New CSS Rule&gt; and click the &#8216;Edit Rule&#8217; button</li>
<li>Create a &#8216;class&#8217; style called &#8216;.sub-bg&#8217; within &#8216;styles.css&#8217;<br />
<img class="alignnone size-full wp-image-596" title="table-background-image" src="http://bestwebdesignz.com/tips/wp-content/uploads/2009/04/table-background-image.gif" alt="Tables in Dreamweaver CS4" width="430" height="411" /></li>
<li>In the &#8216;CSS Rule Definition&#8217; screen choose &#8216;submenu-bg.jpg&#8217; as the background image and select &#8216;repeat-y&#8217; from the &#8216;Background-repeat&#8217; options.<br />
<img class="alignnone size-full wp-image-597" title="table-background-image-css" src="http://bestwebdesignz.com/tips/wp-content/uploads/2009/04/table-background-image-css.gif" alt="Tables in Dreamweaver CS4" width="430" height="411" /></li>
<li>We also don&#8217;t want the submenu text within the middle row to stick to the edges so let&#8217;s give a padding of 10 pixels within the same style. Click OK.<br />
<img class="alignnone size-full wp-image-598" title="table-background-image-css-padding" src="http://bestwebdesignz.com/tips/wp-content/uploads/2009/04/table-background-image-css-padding.gif" alt="Tables in Dreamweaver CS4" width="430" height="411" /></li>
<li>Type in the submenu items<br />
<img class="alignnone size-full wp-image-600" title="submenu" src="http://bestwebdesignz.com/tips/wp-content/uploads/2009/04/submenu.jpg" alt="Tables in Dreamweaver CS4" width="430" height="373" /></li>
<li>You can create new pages and create links to them from this submenu area or you can but textual content that will display on all the pages here.</li>
<li>Save the template and update all the pages.</li>
<li>Preview your pages in the browser and test all the links.</li>
</ul>
<script type="text/javascript"><!--
                    google_ad_client = "pub-7099335855422733";
                    google_ad_slot = "4729128935";
                    google_ad_width = 336;
                    google_ad_height = 280;
                    //-->
                    </script>
                    <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
        </script>
                    ]]></content:encoded>
			<wfw:commentRss>http://bestwebdesignz.com/tips/dreamweaver/tables-in-dreamweaver-cs4/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<series:name><![CDATA[Dreamweaver CS4 Tutorials]]></series:name>
	</item>
	</channel>
</rss>

<!-- Dynamic Page Served (once) in 0.703 seconds -->

