14 Replies Latest reply on Aug 11, 2013 10:52 PM by BrMelendez

    Dreamweaver CS4 Templates with CSS problems

    GrifformInov

      I am fairly new to CSS and am still learning.

      I want to use templates so that each web page has specific elements that can't be changed or destroyed by others working on the site.

      I created templates for my site that have CSS. I feel that I must be doing something "wrong"....

      If I leave the CSS in the template the styles do not show up in the pages built using the template....

      If I attach a  separate CSS to the template the styles will appear in the pages built using the template....

      The problem with that is ALL elements in the CSS are editable on each page... which means that your template basically has NO uneducable regions.

      I would greatly appreciate any info or help regarding this...

       

        • 1. Re: Dreamweaver CS4 Templates with CSS problems
          Randy Edmunds Adobe Employee

          I want to use templates so that each web page has specific elements that can't be changed or destroyed by others working on the site.

          I created templates for my site that have CSS. I feel that I must be doing something "wrong"...

          If I leave the CSS in the template the styles do not show up in the pages built using the template...

           

           

          That should work. Make sure that the embedded style sheet is in the <head>. Or is it a file path problem?

           

          HTH,

          Randy

          • 2. Re: Dreamweaver CS4 Templates with CSS problems
            shaleyky Level 1

            I'm having essentially the same problem. This only happens on SOME sites I build, but not on others. Here's what happens in detail:

             

            Using one of Dreamweaver's built-in templates ("Layout CSS:" is set to "Add to Head"), I create a template (.dwt) page with editable regions. I change the rule definitions of the built-in internal (embedded) styles, listed under <style>, like body, container, sidebar1, etc., to fit my design. Then I add other styles for the divs that I use to build my page. These are saved in "(This document only)" which also puts them under <style>. Then I create an external style sheet (e.g., sitename.css) and save the entire thing (e.g., templatename.dwt).

             

            When I go to make a page based on this templatename.dwt, all the internal styles are listed in the <head> grayed out, like they're supposed to be, but only SOME of them are listed in the CSS Styles pallet under <style>. Some of the built-in internal styles are missing and some (but not all) of the styles I created are missing. What's even more bizarre is that some of the rule definitions for the styles that ARE listed aren't working.

             

            What I'm having to do on this template-based page is make a new internal style sheet -- now I have two items named <style> and one item named sitename.css -- and recreate the missing styles and duplicate the styles that aren't working. Note that the external style sheet sitename.css and the sprymenubar.css (if there is one) are attached to this new page just fine and all rule definitions work. Also, the editable regions work.

             

            Now, the only thing I can do to make other pages (still based on templatename.dwt) is to save-as. This pretty much defeats the purpose of a template. Again, this only happens on some sites, but not on others.

             

            Adobe! Somebody! Please explain what's going on and how I can avoid it in the future.

             

            Thanks,

            shaleyky

            1 person found this helpful
            • 3. Re: Dreamweaver CS4 Templates with CSS problems
              Jonathon Barratt Level 1

              Ensure you have a dot (.) before the style in your CSS (ie .text or .title for all items you want to appear). That should fix the problem!

              • 4. Re: Dreamweaver CS4 Templates with CSS problems
                RichaFrost Level 1

                GrifformInov ,

                 

                I don't know if I understand U correctly, but here is what I did:

                 

                - I had a template attached to several HTML-pages and they updated fine with the template.dwt.

                - Later on I moved the CSS in the template to an external style sheet (stylesheet.css).

                 

                Then my files didn't update anymore, with the changes I made in the CSS. The style-rules in the HTML-files remained looking the same (grey text) as they did before I moved them to a seperate css-file.

                 

                Apparently the problem was that my Template file, although not deleted, wasn't listed as a template for my Site any longer.

                - So, in the assets panel, I, again, attached the Template file to my Site.

                - After this my files were updated when opening them.

                 

                If this wasn't your problem, I hope I helped somebody else.

                 

                 

                 

                Greetings,

                Riesjart.

                1 person found this helpful
                • 5. Re: Dreamweaver CS4 Templates with CSS problems
                  MurraySummers Level 8

                  Even the most eloquent description is not worth the effort compared to a glance at the code.  Show us your code please to get an answer to your specific question.

                  • 6. Re: Dreamweaver CS4 Templates with CSS problems
                    shaleyky Level 1

                    This problem occurs when I'm creating a page from the template, not when I update pages based on a template. That part works fine.

                     

                    Here's the code for the template page:

                     

                     

                    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

                    <html xmlns="http://www.w3.org/1999/xhtml">

                    <head>

                    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

                    <!-- TemplateBeginEditable name="doctitle" -->

                    <title>Western Middle School Visual and Performing Arts Magnet School</title>

                    <!-- TemplateEndEditable -->

                    <style type="text/css">

                    <!--

                    body  {

                    margin: 0;

                    padding: 0;

                    text-align: center;

                    color: #000000;

                    font-family: Verdana, Arial, Helvetica, sans-serif;

                    font-size: 100%;

                    background-color: #000;

                    }

                    .thrColFixHdr #container {

                    width: 900px;

                    text-align: left;

                    margin-top: 0;

                    margin-right: auto;

                    margin-bottom: 0;

                    margin-left: auto;

                    background-image: url(../images/pages/repeatY.gif);

                    background-repeat: repeat-y;

                    }

                    .thrColFixHdr #header {

                    padding: 0;

                    }

                    .thrColFixHdr #sidebar1 {

                    float: left;

                    width: 207px;

                    padding: 0px;

                    background-color: #000;

                    }

                    .thrColFixHdr #sidebar2 {

                    float: right;

                    width: 180px;

                    background-color: #FFF;

                    padding-right: 10px;

                    margin-top: 30px;

                    }

                    .thrColFixHdr #mainContent {

                    margin-top: 0;

                    margin-right: 195px;

                    margin-bottom: 0;

                    margin-left: 212px;

                    padding-top: 0;

                    padding-right: 15px;

                    padding-bottom: 0;

                    padding-left: 15px;

                    }

                    .thrColFixHdr #footer {

                    padding: 0;

                    background-color: #000;

                    background-image: url(../images/pages/page1_16.gif);

                    background-repeat: no-repeat;

                    clear: both;

                    }

                    .thrColFixHdr #footer p {

                    margin: 0;

                    text-align: center;

                    font-family: Arial, Helvetica, sans-serif;

                    font-size: 10px;

                    color: #FFF;

                    padding-top: 12px;

                    padding-right: 0;

                    padding-bottom: 10px;

                    padding-left: 0;

                    line-height: 15px;

                    }

                    #footer p a {

                    color: #06F;

                    }

                    .fltrt {

                    float: right;

                    margin-left: 8px;

                    }

                    .fltlft {

                    float: left;

                    margin-right: 8px;

                    }

                    .clearfloat {

                    clear:both;

                        height:0;

                        font-size: 1px;

                        line-height: 0px;

                    }

                    #s1top {

                    background-color: #000;

                    height: 10px;

                    }

                    #s2top {

                    background-color: #06F;

                    height: 10px;

                    }

                    #s2bottom {

                    background-color: #06F;

                    height: 10px;

                    margin-top: 10px;

                    }

                    -->

                    </style><!--[if IE 5]>

                    <style type="text/css">

                    .thrColFixHdr #sidebar1 { width: 207px; }

                    .thrColFixHdr #sidebar2 { width: 190px; }

                    </style>

                    <![endif]--><!--[if IE]>

                    <style type="text/css">

                    .thrColFixHdr #sidebar2, .thrColFixHdr #sidebar1 { padding-top: 0px; }

                    .thrColFixHdr #mainContent { zoom: 1; }

                    </style>

                    <![endif]-->

                    <script type="text/javascript">

                    <!--

                    function MM_swapImgRestore() { //v3.0

                      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;

                    }

                    function MM_preloadImages() { //v3.0

                      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();

                        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)

                        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}

                    }

                     

                    function MM_findObj(n, d) { //v4.01

                      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {

                        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

                      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];

                      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);

                      if(!x && d.getElementById) x=d.getElementById(n); return x;

                    }

                     

                    function MM_swapImage() { //v3.0

                      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)

                       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}

                    }

                    //-->

                    </script>

                    <link href="../westernms.css" rel="stylesheet" type="text/css" />

                    <!-- TemplateBeginEditable name="head" -->

                    <!-- TemplateEndEditable -->

                    </head>

                     

                    <body class="thrColFixHdr" onload="MM_preloadImages('../images/pages/page2_01.gif','../images/pages/page2_02.gif','. ./images/pages/page2_03.gif','../images/pages/page2_04.gif','../images/pages/page2_05.gif' ,'../images/pages/page2_06.gif','../images/pages/page2_07.gif','../images/pages/page2_08.g if','../images/pages/page2_09.gif','../images/pages/page2_10.gif')">

                     

                    <div id="container">

                      <div id="header"><a href="../index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','../images/pages/page2_01.gif',1)"><img src="../images/pages/page1_01.gif" alt="home" name="Image2" width="57" height="42" border="0" id="Image2" /></a><a href="../about.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','../images/pages/page2_02.gif',1)"><img src="../images/pages/page1_02.gif" alt="about us" name="Image3" width="80" height="42" border="0" id="Image3" /></a><a href="../magnet.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','../images/pages/page2_03.gif',1)"><img src="../images/pages/page1_03.gif" alt="magnet focus" name="Image4" width="113" height="42" border="0" id="Image4" /></a><a href="../parents.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','../images/pages/page2_04.gif',1)"><img src="../images/pages/page1_04.gif" alt="for parents" name="Image5" width="93" height="42" border="0" id="Image5" /></a><a href="../students.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','../images/pages/page2_05.gif',1)"><img src="../images/pages/page1_05.gif" alt="for students" name="Image6" width="103" height="42" border="0" id="Image6" /></a><a href="../library.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image7','','../images/pages/page2_06.gif',1)"><img src="../images/pages/page1_06.gif" alt="library" name="Image7" width="67" height="42" border="0" id="Image7" /></a><a href="../ysc.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','../images/pages/page2_07.gif',1)"><img src="../images/pages/page1_07.gif" alt="youth services center" name="Image8" width="160" height="42" border="0" id="Image8" /></a><a href="../administration.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image9','','../images/pages/page2_08.gif',1)"><img src="../images/pages/page1_08.gif" alt="administration" name="Image9" width="112" height="42" border="0" id="Image9" /></a><a href="../teams.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image10','','../images/pages/page2_09.gif',1)"><img src="../images/pages/page1_09.gif" alt="teams" name="Image10" width="64" height="42" border="0" id="Image10" /></a><a href="../staff.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image11','','../images/pages/page2_10.gif',1)"><img src="../images/pages/page1_10.gif" alt="staff" name="Image11" width="51" height="42" border="0" id="Image11" /></a>

                      <!-- end #header --></div>

                      <div id="sidebar1">

                        <div id="s1top"></div>

                        <img src="../images/pages/page1_11.jpg" alt="western middle school visual and performing arts magnets school" width="207" height="468" border="0" usemap="#Map" />

                        <map name="Map" id="Map">

                          <area shape="rect" coords="7,156,113,230" href="../calendar.html" alt="calendar of events" />

                        </map>

                    <!-- end #sidebar1 --></div>

                      <div id="sidebar2">

                        <div id="s2top"></div>

                        <!-- TemplateBeginEditable name="sidebarright" -->

                        <h3>Sidebar Content</h3>

                        <p>The background color on this div will only show for the length of the content. If you'd like a dividing line instead, place a border on the right side of the #mainContent div if it will always contain more content.      </p>

                        <p>Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. </p>

                        <!-- TemplateEndEditable -->

                        <div id="s2bottom"></div>

                        <!-- end #sidebar2 -->

                      </div>

                      <div id="mainContent">

                      <!-- TemplateBeginEditable name="body" -->

                      <h1>Main Content </h1>

                      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. </p>

                      <h2>H2 level heading </h2>

                      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio.</p>

                      <!-- TemplateEndEditable -->

                      <!-- end #mainContent -->

                      </div>

                    <!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />

                      <div id="footer">

                        <p>2201 West Main Street, Louisville, Kentucky  40212 | (502) 485-8345<br />

                        </p>

                      <!-- end #footer --></div>

                    <!-- end #container --></div>

                    </body>

                    </html>

                     

                     

                    Here's the CSS:

                     

                     

                    .imageright {

                    float: right;

                    }

                    .imageleft {

                    float: left;

                    }

                    p {

                    font-family: Arial, Helvetica, sans-serif;

                    font-size: 14px;

                    }

                    h1 {

                    font-family: Tahoma, Geneva, sans-serif;

                    font-size: 30px;

                    font-weight: normal;

                    color: #C00;

                    letter-spacing: -0.05em;

                    margin-bottom: -5px;

                    }

                    h2 {

                    font-family: Tahoma, Geneva, sans-serif;

                    font-size: 24px;

                    color: #00C;

                    margin-top: 5px;

                    margin-bottom: -5px;

                    font-weight: normal;

                    }

                    h4 {

                    font-family: Arial, Helvetica, sans-serif;

                    font-size: 16px;

                    margin-bottom: -5px;

                    }

                    h3 {

                    font-family: Tahoma, Geneva, sans-serif;

                    font-size: 18px;

                    font-weight: normal;

                    color: #F90;

                    margin-top: 5px;

                    margin-bottom: -5px;

                    }

                    .imagecenter {

                    text-align: center;

                    }

                    .centeredwhite {

                    color: #FFF;

                    text-align: center;

                    }

                    li {

                    font-family: Arial, Helvetica, sans-serif;

                    font-size: 14px;

                    margin-bottom: 2px;

                    padding-bottom: 2px;

                    }

                    ul {

                    margin-left: 8px;

                    padding-left: 8px;

                    }

                    .tinytype {

                    font-family: Verdana, Geneva, sans-serif;

                    font-size: 9px;

                    }

                    .boldred {

                    font-weight: bold;

                    color: #C00;

                    }

                    .boldredcentered {

                    font-weight: bold;

                    color: #C00;

                    text-align: center;

                    font-size: 12px;

                    }

                    td {

                    font-family: Arial, Helvetica, sans-serif;

                    font-size: 12px;

                    }

                    .biohead {

                    margin-bottom: -10px;

                    }

                     

                    This particular website has now been posted, so here's the URL for a page based on this template and CSS:

                     

                    http://www.jefferson.k12.ky.us/Schools/Middle/Western/about.html

                     

                    Any help is greatly appreciated!
                    shaleyky
                    1 person found this helpful
                    • 7. Re: Dreamweaver CS4 Templates with CSS problems
                      MurraySummers Level 8

                      When I go to make a page based on this templatename.dwt, 
                      all the internal styles are listed in the <head> grayed out, 
                      like they're supposed to be, but only SOME of them are listed 
                      in the CSS Styles pallet under <style>. Some of the built-in 
                      internal styles are missing and some (but not all) of the 
                      styles I created are missing. What's even more bizarre is that 
                      some of the rule definitions for the styles that ARE listed aren't working.
                      
                      
                      

                       

                      Can you give us an example of rules that are missing?

                       

                      So, I could try to reproduce your finding by saving this template page in my test site, spawning a child page from it with FILE | New from Template..., and looking in the CSS panel?

                      • 8. Re: Dreamweaver CS4 Templates with CSS problems
                        shaleyky Level 1

                        The missing rules are:

                         

                        .thrColFixHdr #header

                        .thrColFixHdr #sidebar1

                        .thrColFixHdr #sidebar2

                        .thrColFixHdr #maincontent

                        .thrColFixHdr #footer

                         

                        Note: All of the missing rules are ones that come as a part of the built-in Dreamweaver template. Any rule I created myself is present.

                         

                         

                        Here's what it looks like when I make a page from this template.

                         

                        badtmpltpage.jpg

                         

                        Here's what the template looks like:

                        template.jpg

                        • 9. Re: Dreamweaver CS4 Templates with CSS problems
                          MurraySummers Level 8

                          Note: All of the missing rules are ones that come as a part of the built-in Dreamweaver template. Any rule I created myself is present.

                           

                          But you see *some* of the rules that are part of that stock template, right?  Just not all of them?  And these are embedded in the page, right?  You see them when you look at the code?

                          • 10. Re: Dreamweaver CS4 Templates with CSS problems
                            shaleyky Level 1

                            I hadn't noticed before, but yes, the stock rules are in the grayed-out code of the new page (the code that's only editable on the template I created), but "some" are not present in the list of rules. And the ones not present in the list don't work.

                            • 11. Re: Dreamweaver CS4 Templates with CSS problems
                              MurraySummers Level 8

                              How many files do you have in the current site?

                              • 12. Re: Dreamweaver CS4 Templates with CSS problems
                                shaleyky Level 1

                                In this particular site, 69 pages based on this template, 1 page based on another template, and 1 homepage. But this happens with all sites I create using a Dreamweaver stock template. This site is already complete and posted. I made pages by fixing one page (remaking the missing rules) and doing a save-as for all other pages. I only used the template for updating navigation or changing the artwork in the left column.

                                • 13. Re: Dreamweaver CS4 Templates with CSS problems
                                  Randy Edmunds Adobe Employee

                                  The missing rules are:

                                   

                                  .thrColFixHdr #header

                                  .thrColFixHdr #sidebar1

                                  .thrColFixHdr #sidebar2

                                  .thrColFixHdr #maincontent

                                  .thrColFixHdr #footer

                                   

                                  Note: All of the missing rules are ones that come as a part of the built-in Dreamweaver template. Any rule I created myself is present.

                                   

                                  I notice that all of the missing rules coincide with rules that are inside IE Conditional Comments. That shouldn't make a difference, but here's something to try. Install this extension:

                                   

                                  http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&loc=en_us&extid=1564 018

                                   

                                  Then set your IECC Support Level to "Show All", then try it again.

                                   

                                  Note that changing the IECC SUpport Level also affects page rendering, so you may want to change it back to "Downlevel" afterwards.

                                   

                                  Regards,

                                  Randy

                                  • 14. Re: Dreamweaver CS4 Templates with CSS problems
                                    BrMelendez

                                    I am  teaching my self how to build my website and I am having problems with a template I created.

                                    When i preview the page in Safari it looks fine. However, when I click on the home link the page does not show any images or the css. While the spry menubar is okay it is not centered. The css is external.

                                     

                                    Here is the code:

                                     

                                     

                                     

                                    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

                                        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

                                     

                                     

                                    <html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/temp1.dwt" codeOutsideHTMLIsLocked="false" -->

                                    <head>

                                      <meta name="generator" content=

                                      "HTML Tidy for Linux/x86 (vers 25 March 2009), see www.w3.org" />

                                      <meta http-equiv="Content-Type" content="text/html; charset=us-ascii" />

                                      <!-- InstanceBeginEditable name="doctitle" -->

                                     

                                     

                                      <title>Branden Melendez Illustration and Design</title><!-- InstanceEndEditable -->

                                     

                                     

                                      <style type="text/css">

                                    /*<![CDATA[*/

                                      <!--

                                      body {

                                            background-color: #a8afbd;

                                      }

                                      -->

                                      /*]]>*/

                                      </style>

                                      <link href="/css/layout.css" rel="stylesheet" type="text/css" />

                                      <script src="SpryAssets/SpryMenuBar.js" type="text/javascript">

                                    </script>

                                      <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type=

                                      "text/css" /><!-- InstanceBeginEditable name="head" --><!-- InstanceEndEditable -->

                                     

                                     

                                      <style type="text/css">

                                    /*<![CDATA[*/

                                      <!--

                                      a:link {

                                            color: #FFFFFF;

                                            text-decoration: none;

                                      }

                                      a:visited {

                                            text-decoration: none;

                                            color: #FFFFFF;

                                      }

                                      a:hover {

                                            text-decoration: underline;

                                            color: #CCCCCC;

                                      }

                                      a:active {

                                            text-decoration: none;

                                      }

                                      -->

                                      /*]]>*/

                                      </style>

                                    </head>

                                     

                                     

                                    <body>

                                      <div id="fb-root"></div><script type="text/javascript">

                                    //<![CDATA[

                                      (function(d, s, id) {

                                      var js, fjs = d.getElementsByTagName(s)[0];

                                      if (d.getElementById(id)) return;

                                      js = d.createElement(s); js.id = id;

                                      js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";

                                      fjs.parentNode.insertBefore(js, fjs);

                                      }(document, 'script', 'facebook-jssdk'));

                                      //]]>

                                      </script>

                                     

                                     

                                      <div id="wrapper">

                                        <div id="Header">

                                          <div align="center"><img src="/images/headerlogo.png" alt="logo" width="745"

                                          height="79" /></div>

                                        </div>

                                     

                                     

                                        <table width="854" border="0">

                                          <tr>

                                            <th scope="col">

                                              <ul id="MenuBar1" class="MenuBarHorizontal">

                                                <li><a href="index.html">Home</a></li>

                                     

                                     

                                                <li>

                                                  <a class="MenuBarItemSubmenu" href="#">Portfolio</a>

                                     

                                     

                                                  <ul>

                                                    <li><a href="arch-cowell.html">Anthropology</a></li>

                                     

                                     

                                                    <li><a href="a-caracal.html">Zoology</a></li>

                                     

                                     

                                                    <li><a href="t-uav.html">Technical</a></li>

                                     

                                     

                                                    <li><a href="p-chicago%20flyer.html">Print</a></li>

                                     

                                     

                                                    <li><a href="o-divided.html">Other</a></li>

                                                  </ul>

                                                </li>

                                     

                                     

                                                <li><a href="about.html">About</a></li>

                                     

                                     

                                                <li><a href="contact.html">Contact</a></li>

                                     

                                     

                                                <li><a href="news.html">News</a></li>

                                              </ul>

                                            </th>

                                          </tr>

                                        </table>

                                     

                                     

                                        <div id="Content">

                                          <!-- InstanceBeginEditable name="Main Body" -->

                                     

                                     

                                          <div align="center"><img src="/images/kagayaodeemblem.png" alt=

                                          "Branden Melendez Illustration and Design Logo" width="494" height="485" /></div>

                                          <!-- InstanceEndEditable -->

                                        </div>

                                     

                                     

                                        <div id="Footer">

                                          <div align="center">

                                            <a href=

                                            "https://www.facebook.com/pages/Branden-Melendez-Illustration-and-Design/147828168617998">

                                            <img src="/images/invertedfacebooklogo.png" alt=

                                            "Branden Melendez Illustration and Design Facebook page Link" width="20" height=

                                            "20" /></a>

                                          </div>

                                     

                                     

                                          <div class="fb-like" data-href="http://www.melendezillustration.com/" data-width=

                                          "450" data-show-faces="false" data-send="false"></div>

                                     

                                     

                                          <p>

                                                         <a href="Mailto:brandenmelendez1@gmail.com">brandenmelendez1@gmail.com</a>                                              All

                                          Images &copy; Branden Melendez. All Rights Reserved.</p>

                                        </div>

                                      </div><script type="text/javascript">

                                    //<![CDATA[

                                      <!--

                                      var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"/SpryAssets/SpryMenuBarDownHover.gif", imgRight:"/SpryAssets/SpryMenuBarRightHover.gif"});

                                      //-->

                                      //]]>

                                      </script>

                                    </body>

                                    <!-- InstanceEnd --></html>