Expand editable regions size

Anyone know how to make the editable region bigger?

> Anyone know how to make the editable region bigger?
Editable regions don't have a size.
Any size limitations are taken from whatever container
they've been placed
in.
Open the template.
Click in the editable region.
Look at the list of tags in the Quick Tag Editor (bottom left
margin of
design window) to see what containers it is placed in.
Alan
Adobe Community Expert, dreamweaver
http://www.adobe.com/communities/experts/

Similar Messages

  • Editable region

    Help! Is there a way to limit an editable region to a fixed size?
    I have a pretty simple design sliced into four pieces: Header, horizontal navbar, main body, footer. I've made the mainbody into an editable region. But if I add more text that the exact size of the mainbody divtag, my page breaks apart wehre the mainbody and footer meet.
    I have gone into CSS and typed in the height dimension in the div (#wrapper #mainBody #mainContent), but it didn't make a difference. When I added it to the paragraph div (#wrapper #mainBody #mainContent p), the type went crazy.
    I've spent hours trying to work this out. I'm now considering just working around this -- ie, inserting content until I see the page breaks up. But there must be a simpler and safer method to do this.
    Many thanks to anyone who can help. CSS and HTML coding is below:
    @charset "UTF-8";
        padding: 0px;
        margin-top: 0px;
        margin-right: auto;
        margin-bottom: 0px;
        margin-left: auto;
    #wrapper {
        background-color: #999;
        width: 800px;
    #wrapper #header {
        background-color: #999;
        height: 150px;
        width: 800px;
    #wrapper #navBar {
        height: 50px;
        width: 800px;
        background-image: url(../template%20images/navBar.jpg);
        margin: 0px;
    #wrapper #mainBody {
        height: 990px;
        width: 800px;
        background-image: url(../template%20images/body.jpg);
    #wrapper #footer {
        background-image: url(../template%20images/footer.jpg);
        height: 60px;
        width: 800px;
    #wrapper #mainBody #mainContent {
        padding-top: 25px;
        padding-right: 80px;
        padding-bottom: 0px;
        padding-left: 80px;
        margin-bottom: 0px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14px;
        height: 965px;
    #wrapper #mainBody #mainContent p {
        height: 0px;
        margin: 0px;
    #wrapper #footer #pageNumber {
         font-size: 18px;
         font-weight: normal;
         padding-top: 10px;
         text-align: center;
         font-family: Arial, Helvetica, sans-serif;
    HTML:
    <body>
    10
    <div id="wrapper">
    <div id="header"><img src="template images/header.jpg" width="800" height="150" alt="project name" />
    </div><!--close header-->
    <div id="navBar">
      <ul id="MenuBar1" class="MenuBarHorizontal">
        <li><a href="#">home</a>      </li>
        <li><a href="#">about</a></li>
        <li><a href="#">menu</a></li>
        <li><a href="#">contact</a></li>
        <li><a class="MenuBarItemSubmenu" href="#">index</a>
          <ul>
            <li><a class="MenuBarItemSubmenu" href="#">Homeland</a>
              <ul>
                <li><a href="#">submenu</a></li>
                <li><a href="#">submenu</a></li>
              </ul>
            </li>
            <li><a href="#" class="MenuBarItemSubmenu">subject here</a>
              <ul>
                <li><a href="#">submenu</a></li>
              </ul>
            </li>
            <li><a href="#">submenu</a></li>
          </ul>
        </li>
    </ul>
    </div><!--close navBar-->
    <div id="mainBody">
    <div id="mainContent"> <!--Begin editable region-->
      <!-- TemplateBeginEditable name="2000Template1" -->
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nisl metus, aliquam et ultricies vitae, faucibus ut libero. Fusce molestie lectus nunc, vel interdum leo. Nunc gravida mattis leo, a laoreet felis tincidunt eget. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec et sapien in felis consequat vestibulum eu ac felis. Praesent pellentesque dolor vel mi euismod eget ultrices velit dignissim. Duis erat urna, aliquam vel malesuada eu, sollicitudin vel ante. Maecenas vitae dui nisi, ac molestie dolor. Suspendisse non neque odio, et dapibus lacus. Pellentesque bibendum justo non turpis tempor a porta risus pharetra. Etiam a felis quis orci molestie aliquet. Phasellus aliquam lacus sed magna venenatis et accumsan justo blandit. Sed id velit turpis. Nunc sit amet placerat libero. Nam sollicitudin, sem ut sollicitudin convallis, dolor tellus volutpat risus, quis lacinia diam purus nec tellus. Quisque at purus euismod lorem semper rhoncus. In hac habitasse platea dictumst. </p>
       <!-- TemplateEndEditable --></div><!--Close editable region-->
    </div><!--close mainBody-->
    <div id="footer">
    <div id="pageNumber"><!--Start optional edit region-->
    <p><< Previous Page 1 : 2 : 3 Continue >></p>
    </div><!--close optional edit region-->
    </div><!--close footer-->
    </div><!--close wrapper-->
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    </body>
    </html>

    Nancy and Paul,
    Many thanks for the quick reply.
    To clarify, I am building a website that will feature a series of essays, so the content is very text heavy. There will be a photo and occasional graphic to break up the text on each page, but otherwise it's just words, words, words. Even with such a large display space (ie, the mainContent <div>, 800x990 px), these essays will run two to five pages long.
    I have not yet gone live, so I cannot post a link. However, I've attached a jpg of the prototype:
    As you can see, I've used a non-repeatable textured background. Hence my problem: The type that I fit into the mainContent cannot run longer than what the <div> allows, as the main content section will not expand. Rather, text runs off the maincontent section and the design breaks where the footer begins (page number at the bottom). I was fooling around with the height rule in a failed effort to create a bottom margin or padding that would stop the type from overflowing.
    So, is there a way I can still work with this? Or as Nancy suggested, is my design too regid for the web?
    Thank you again for your help. I am brand new to webdesign, and am rather befuddled at the moment....
    PS to Gary: The mainContent <div> created a container that gave me my left, right and top padding for the text and photos. (The mainBody <div> margins ran into the black margins on both sides and up to the navBar at the top.)  I had hoped the same <div> would set the bottom padding, too, but it didn't work.

  • Problem with editing Editable Region - HELP!

    My website is www.yucholian.com
    I have created a template and have assigned a main body to be
    an Editable Region. However, I can't seem to use different fonts,
    sizes or styles as I wish. If I go to Text drop down, go to size,
    all options are greyed out. Can anyone help?
    BTW, I'm using 30 day trial.
    I find Dreamweaver to be very finicky. Even something simple
    as applying a template that I created, view doesn't update, showing
    doubles...
    Thanks in advance.

    > I find Dreamweaver to be very finicky. Even something
    simple as applying
    > a
    > template that I created, view doesn't update, showing
    doubles...
    The more you know about HTML, the less you will run into such
    things - but I
    have to say, I have no idea what you are describing here. It
    sounds to me
    like user error, but I can't say for sure.
    > However, I can't seem to use different fonts, sizes or
    styles as I
    > wish.
    Show me your template, tell me what you are trying to change,
    and I'll
    explain to you what is happening.
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.dreamweavermx-templates.com
    - Template Triage!
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    http://www.macromedia.com/support/search/
    - Macromedia (MM) Technotes
    ==================
    "yucholian" <[email protected]> wrote in
    message
    news:edk7lr$73m$[email protected]..
    > My website is www.yucholian.com
    > I have created a template and have assigned a main body
    to be an Editable
    > Region. However, I can't seem to use different fonts,
    sizes or styles as
    > I
    > wish. If I go to Text drop down, go to size, all options
    are greyed out.
    > Can
    > anyone help?
    > BTW, I'm using 30 day trial.
    > I find Dreamweaver to be very finicky. Even something
    simple as applying
    > a
    > template that I created, view doesn't update, showing
    doubles...
    >
    > Thanks in advance.
    >

  • Why does this happen when I insert editable region?

    Hi ppl... I got a small problem here. When I insert editing region into the ORANGEBOX div, for some unknown reason which I can't figure out, my spry menu bar shifts to the left. But in preview, it looks fine. What's the reason for this and how can I avoid it? The shifted spry menu bar in the workspace is disturbing me.. haha.. I have attached screenshots of the 2 states below (Before inserting editable region and after inserting editable region)
    Before inserting editable region into the ORANGE BOX
    After inserting editable region into the ORANGEBOX
    Here's the code BEFORE inserting editable region.. If you are free, do try to insert an editable region into the ORANGEBOX, and kindly tell me why it's happening! =) Thanks!
    <!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>Untitled Document</title>
    <!-- TemplateEndEditable -->
    <style type="text/css">
    <!--
    body {
        background-color: #666;
        margin: 0px;
        padding: 0px;
        margin: 0px;
        padding: 0px;
    #wrapper {
        padding: 0px;
        width: 900px;
        margin-right: auto;
        margin-left: auto;
        margin-top: 0px;
        overflow: hidden;
    #navigation {
        height: 122px;
    #mainContent {
        background-color: #FFF;
        overflow: hidden;
    #header {
        background-color: #033;
        height: 248px;
    #navigationlinks {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14px;
        font-weight: bold;
        color: #000;
        height: 42px;
        background-color: #0C0;
    #footer {
        height: 100px;
        background-color: #F39;
    #orangebox {
        height: 100px;
        width: auto;
        background-color: #F60;
    -->
    </style>
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
    <div id="wrapper">
      <div id="header"></div>
      <div id="navigationlinks">
        <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a href="#">Home</a>      </li>
          <li><a href="#">Audio Lectures</a></li>
          <li><a class="MenuBarItemSubmenu" href="#">Video Lectures</a>
            <ul>
              <li><a href="aqeedah1.htm">Aqeedah</a></li>
              <li><a href="fundamentals1.shtml">Tawheed</a></li>
    <li><a href="#">Friday Bayans</a></li>
    <li><a href="#">Other Topics</a></li>
            </ul>
          </li>
          <li><a href="#">Books</a></li>
        </ul>
      </div>
      <div id="mainContent">
        <p> </p>
        <p>mainContent</p>
        <p> </p>
        <div id="orangebox">
          <p>ORANGE BOX    </p>
          <p> </p>
        </div>
    <p> </p>
        <p>mainContent</p>
        <p> </p>
        <p> </p>
      </div>
      <div id="footer">
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p>FOOTER </p>
        <p> </p>
        <p> </p>
        <p> </p>
      </div>
      <p> </p>
      <p> </p>
    </div>
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    </body>
    </html>

    Here's the SpryMenuBarHorizontal.css
    @charset "UTF-8";
    /* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    LAYOUT INFORMATION: describes box model, positioning, z-order
    /* The outermost container of the Menu Bar, an auto width box with no margin or padding */
    ul.MenuBarHorizontal
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        cursor: default;
        width: auto;
    /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
    ul.MenuBarActive
        z-index: 1000;
    /* Menu item containers, position children relative to this container and are a fixed width */
    ul.MenuBarHorizontal li
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        position: relative;
        text-align: left;
        cursor: pointer;
        width: 9em;
        float: left;
    /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarHorizontal ul
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        z-index: 1020;
        cursor: default;
        width: 9em;
        position: absolute;
        left: -1000em;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
        left: auto;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal ul li
        width: 9em;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
    ul.MenuBarHorizontal ul ul
        position: absolute;
        margin: -5% 0 0 95%;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
        left: auto;
        top: 0;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Submenu containers have borders on all sides */
    ul.MenuBarHorizontal ul
        border: 1px solid #CCC;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
        display: block;
        cursor: pointer;
        color: #333;
        text-decoration: none;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        font-weight: bold;
        padding-top: 1.1em;
        padding-right: 0.75em;
        padding-bottom: 1.1em;
        padding-left: 0.75em;
        text-align: center;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
        color: #FFF;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
        color: #FFF;
    SUBMENU INDICATION: styles if there is a submenu under a given menu item
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenu
        background-image: url(SpryMenuBarDown.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
        background-image: url(SpryMenuBarRight.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
        background-repeat: no-repeat;
        background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
        background-image: url(SpryMenuBarRightHover.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    BROWSER HACKS: the hacks below should not be changed unless you are an expert
    /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
    ul.MenuBarHorizontal iframe
        position: absolute;
        z-index: 1010;
        filter:alpha(opacity:0.1);
    /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
    @media screen, projection
        ul.MenuBarHorizontal li.MenuBarItemIE
        display: inline;
        f\loat: left;

  • Template_Can't edit in editable region

    I created a template but an unable to edit in the editable region.  Does anyone know why?  Here is the code for the parent pasted below and I will paste the code for the child on another post.   Here is what it looks like in Dreamweaver:  
    Here is the error message that I'm getting for the child:
    Can someone please help? 
    <!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>Inland Empire Waterkeeper</title>
    <!-- TemplateEndEditable -->
    <link href="../_css/styles.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" />
    <style type="text/css">
    body,td,th {
        color: #333333;
        font-family: Verdana, Geneva, sans-serif;
        font-size: 12px;
    body {
        background-color: #FFFFFF;
        color: #D6D6D6;
        background-image: url(../_images/background_teal.png);
        background-repeat: repeat-x;
        margin: auto;
        margin-left: 0px;
        margin-top: 0px;
        margin-right: 0px;
        margin-bottom: 0px;
    h1 {
        font-size: 28px;
        color: #666666;
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;   
    h2 {
        font-size: 22px;
        color: #666666;
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;
    h3 {
        font-size: 20px;
        color: #666666;
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;
    h4 {
        font-size: 18px;
        color: #666666;
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;
    h5 {
        font-size: 16px;
        color: #666666;
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;
    h6 {
        font-size: 14px;
        color: #666666;
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;
    p {
        margin-top: 0;
        margin-bottom: 0;
        text-align: justify;
    </style>
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    </head>
    <body>
    <div class="container">
      <div class="header"><!-- TemplateBeginEditable name="header" --><img src="../_images/banner.jpg" width="933" height="300" /><!-- TemplateEndEditable --></div>
      <div class="menubar">
        <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a href="#" class="MenuBarItemSubmenu">About Us</a>
            <ul>
              <li><a href="../organization.html" class="MenuBarItemSubmenu">Our Org.</a>
                <ul>
                  <li><a href="../mission.html">Our Mission</a></li>
                  <li><a href="../history.html">Our History</a></li>
                  <li><a href="../community.html">Our Community</a></li>
                </ul>
              </li>
              <li><a href="../team.html" class="MenuBarItemSubmenu">Our Team</a>
                <ul>
                  <li><a href="../staff.html">Staff</a></li>
                  <li><a href="../supporters.html">Supporters</a></li>
                  <li><a href="../advisoryboard.html">Advisory Board</a></li>
                </ul>
              </li>
              <li><a href="../coastkeeper.html">Coastkeeper</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">What We Do</a>
            <ul>
              <li><a href="../programs.html" class="MenuBarItemSubmenu">Programs</a>
                <ul>
                  <li><a href="../advocacy.html">Advocacy</a></li>
                  <li><a href="../education.html">Education</a></li>
                  <li><a href="../research.html">Research</a></li>
                  <li><a href="../restoration.html">Restoration</a></li>
                  <li><a href="../enforcement.html">Enforcement</a></li>
                </ul>
              </li>
              <li><a href="../prokects.html">Projects</a></li>
              <li><a href="../datareports.html">Data &amp; Reports</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">Get Involved</a>
            <ul>
              <li><a href="../volunteer.html">Volunteer</a></li>
              <li><a href="../employment.html">Employment</a></li>
              <li><a href="../events.html">Events &amp; Meetings</a></li>
              <li><a href="../donate.html">Donate</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">News Room</a>
            <ul>
              <li><a href="../pressrelease.html">In the News and Press Releases</a></li>
              <li><a href="../legislation.html">Legislative Updates</a></li>
              <li><a href="../waternews.html">Water in the News</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">Resources</a>
            <ul>
              <li><a href="#" class="MenuBarItemSubmenu">Information</a>
                <ul>
                  <li><a href="../watershed.html">Our Watershed</a></li>
                  <li><a href="../reportpollution.html">Report Pollution</a></li>
                </ul>
              </li>
              <li><a href="../photos.html">Photo Gallery</a></li>
            </ul>
          </li>
          <li><a href="../contact.html">Contact Us</a></li>
        </ul>
      </div>
      <div class="body">
        <div class="emptyspacecontent">
        <h4><strong style="text-align:  justify;"><!-- TemplateBeginEditable name="Content" -->Content<!-- TemplateEndEditable --><br />
        </strong></h4>
    </div>
          <div class="emptyspace4"><!-- TemplateBeginEditable name="space" -->space<!-- TemplateEndEditable --></div>
      </div>
    <div class="footer"><!-- TemplateBeginEditable name="footer" --><img src="../_images/footer_transparent.png" width="933" height="100" alt="Inland Empire Waterkeeper" /><!-- TemplateEndEditable --></div>
    </div>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    </html>

    Here is the code for the child:
    <!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/template.dwt" codeOutsideHTMLIsLocked="false" -->
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!-- InstanceBeginEditable name="doctitle" -->
    <title>Inland Empire Waterkeeper</title>
    <!-- InstanceEndEditable -->
    <link href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/_css/styles.css" rel="stylesheet" type="text/css" />
    <script src="file:///C|/Users/Mondays/Desktop/iewaterkeeper/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/SpryAssets/SpryMenuBarHorizontal.css " rel="stylesheet" type="text/css" />
    <style type="text/css">
    body,td,th {
        color: #333333;
        font-family: Verdana, Geneva, sans-serif;
        font-size: 12px;
    body {
        background-color: #FFFFFF;
        color: #D6D6D6;
        background-image: url(file:///C|/Users/Mondays/Desktop/iewaterkeeper/_images/background_teal.png);
        background-repeat: repeat-x;
        margin: auto;
        margin-left: 0px;
        margin-top: 0px;
        margin-right: 0px;
        margin-bottom: 0px;
    h1 {
        font-size: 28px;
        color: #666666;
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;   
    h2 {
        font-size: 22px;
        color: #666666;
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;
    h3 {
        font-size: 20px;
        color: #666666;
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;
    h4 {
        font-size: 18px;
        color: #666666;
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;
    h5 {
        font-size: 16px;
        color: #666666;
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;
    h6 {
        font-size: 14px;
        color: #666666;
        margin-top: 0;
        margin-bottom: 0;
        text-align: left;
    p {
        margin-top: 0;
        margin-bottom: 0;
        text-align: justify;
    </style>
    <!-- InstanceBeginEditable name="head" -->
    <!-- InstanceEndEditable -->
    </head>
    <body>
    <div class="container">
      <div class="header"><!-- InstanceBeginEditable name="header" --><img src="file:///C|/Users/Mondays/Desktop/iewaterkeeper/_images/banner.jpg" width="933" height="300" /><!-- InstanceEndEditable --></div>
      <div class="menubar">
        <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a href="#" class="MenuBarItemSubmenu">About Us</a>
            <ul>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/organization.html" class="MenuBarItemSubmenu">Our Org.</a>
                <ul>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/mission.html">Our Mission</a></li>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/history.html">Our History</a></li>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/community.html">Our Community</a></li>
                </ul>
              </li>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/team.html" class="MenuBarItemSubmenu">Our Team</a>
                <ul>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/staff.html">Staff</a></li>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/supporters.html">Supporters</a></li>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/advisoryboard.html">Advisory Board</a></li>
                </ul>
              </li>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/coastkeeper.html">Coastkeeper</a></l i>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">What We Do</a>
            <ul>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/programs.html" class="MenuBarItemSubmenu">Programs</a>
                <ul>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/advocacy.html">Advocacy</a></li>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/education.html">Education</a></li>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/research.html">Research</a></li>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/restoration.html">Restoration</a></l i>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/enforcement.html">Enforcement</a></l i>
                </ul>
              </li>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/prokects.html">Projects</a></li>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/datareports.html">Data &amp; Reports</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">Get Involved</a>
            <ul>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/volunteer.html">Volunteer</a></li>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/employment.html">Employment</a></li>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/events.html">Events &amp; Meetings</a></li>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/donate.html">Donate</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">News Room</a>
            <ul>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/pressrelease.html">In the News and Press Releases</a></li>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/legislation.html">Legislative Updates</a></li>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/waternews.html">Water in the News</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">Resources</a>
            <ul>
              <li><a href="#" class="MenuBarItemSubmenu">Information</a>
                <ul>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/watershed.html">Our Watershed</a></li>
                  <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/reportpollution.html">Report Pollution</a></li>
                </ul>
              </li>
              <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/photos.html">Photo Gallery</a></li>
            </ul>
          </li>
          <li><a href="file:///C|/Users/Mondays/Desktop/iewaterkeeper/contact.html">Contact Us</a></li>
        </ul>
      </div>
      <div class="body">
        <div class="emptyspacecontent">
        <h4><strong style="text-align:  justify;"><!-- InstanceBeginEditable name="Content" -->Content<!-- InstanceEndEditable --><br />
        </strong></h4>
    </div>
          <div class="emptyspace4"><!-- InstanceBeginEditable name="space" -->space<!-- InstanceEndEditable --></div>
      </div>
    <div class="footer"><!-- InstanceBeginEditable name="footer" --><img src="file:///C|/Users/Mondays/Desktop/iewaterkeeper/_images/footer_transparent.png" width="933" height="100" alt="Inland Empire Waterkeeper" /><!-- InstanceEndEditable --></div>
    </div>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    <!-- InstanceEnd --></html>

  • Modifying a template resulted in all child pages with repeating editable regions - Help !

    Good morning,
    I have recently been appointed to update a website designed in Dreamweaver by an employee who is no longer here. I have read books on the software and practiced an insane amount which permitted me to update child pages, links, documents etc... however:
    I was asked to add a new button to an "non-editable" region of a template. Trying to do so resulted in a massive mess (with massive anxiety).
    Even thou the new template had all the same text and editable regions, all my pages look completely different from the template itself. The editable regions appears 2-3 times in different locations ex: Header is showed on the bottom, top etc... and the Editable region titles (EditableRegion1 etc...) repeat themselves as well.
    I really need help and not sure what to do, I have tried everything and I am only making it worse and worse. All I want/need is for all my html pages created with this template, match the template.
    Please note that this site is local, not online.
    Since I noticed on other threads that the code is needed; here it is:
    <!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" />
    <title>QMS: AFM</title>
    <style type="text/css">
    <!--
    body  {
    font: 100% Verdana, Arial, Helvetica, sans-serif;
    background: #666666;
    margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
    padding: 0;
    text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
    color: #000000;
    background-color: #D7D7D7;
    background-repeat: repeat-x;
    border-top-color: #066;
    border-right-color: #066;
    border-bottom-color: #066;
    border-left-color: #066;
    /* Tips for Elastic layouts
    1. Since the elastic layouts overall sizing is based on the user's default fonts size, they are more unpredictable. Used correctly, they are also more accessible for those that need larger fonts size since the line length remains proportionate.
    2. Sizing of divs in this layout are based on the 100% font size in the body element. If you decrease the text size overall by using a font-size: 80% on the body element or the #container, remember that the entire layout will downsize proportionately. You may want to increase the widths of the various divs to compensate for this.
    3. If font sizing is changed in differing amounts on each div instead of on the overall design (ie: #sidebar1 is given a 70% font size and #mainContent is given an 85% font size), this will proportionately change each of the divs overall size. You may want to adjust based on your final font sizing.
    .twoColElsLtHdr #container {
    width: 46em;  /* this width will create a container that will fit in an 800px browser window if text is left at browser default font sizes */
    background: #FFFFFF;
    margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
    border: 30px none #C4C4C4;
    text-align: left; /* this overrides the text-align: center on the body element. */
    padding-left: 10px;
    background-color: #FFF;
    border-top-color: #C4C4C4;
    border-right-color: #C4C4C4;
    border-bottom-color: #C4C4C4;
    border-bottom-style: outset;
    border-left-style: outset;
    border-top-width: thick;
    border-right-style: outset;
    border-top-style: outset;
    border-left-color: #C4C4C4;
    border-right-width: thick;
    border-bottom-width: thick;
    border-left-width: thick;
    .twoColElsLtHdr #header {
    padding: 0 10px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
    background-color: #FFF;
    .twoColElsLtHdr #header h1 {
    margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
    padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
    /* Tips for sidebar1:
    1. Be aware that if you set a font-size value on this div, the overall width of the div will be adjusted accordingly.
    2. Since we are working in ems, it's best not to use padding on the sidebar itself. It will be added to the width for standards compliant browsers creating an unknown actual width.
    3. Space between the side of the div and the elements within it can be created by placing a left and right margin on those elements as seen in the ".twoColElsLtHdr #sidebar1 p" rule.
    .twoColElsLtHdr #sidebar1 {
    float: left;
    width: 12em; /* the background color will be displayed for the length of the content in the column, but no further */
    padding: 15px 0; /* top and bottom padding create visual space within this div */
    background-color: #066;
    background-repeat: repeat-x;
    border-top-width: thin;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-right-width: thin;
    border-bottom-width: thin;
    border-left-width: thin;
    color: #FFF;
    padding-left: 0px;
    clear: left;
    .twoColElsLtHdr #sidebar1 h3, .twoColElsLtHdr #sidebar1 p {
    margin-left: 10px; /* the left and right margin should be given to every element that will be placed in the side columns */
    margin-right: 10px;
    background-color: #066;
    text-decoration: inherit;
    /* Tips for mainContent:
    1. If you give this #mainContent div a font-size value different than the #sidebar1 div, the margins of the #mainContent div will be based on its font-size and the width of the #sidebar1 div will be based on its font-size. You may wish to adjust the values of these divs.
    2. The space between the mainContent and sidebar1 is created with the left margin on the mainContent div.  No matter how much content the sidebar1 div contains, the column space will remain. You can remove this left margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends.
    3. To avoid float drop, you may need to test to determine the approximate maximum image/element size since this layout is based on the user's font sizing combined with the values you set. However, if the user has their browser font size set lower than normal, less space will be available in the #mainContent div than you may see on testing.
    4. In the Internet Explorer Conditional Comment below, the zoom property is used to give the mainContent "hasLayout." This avoids several IE-specific bugs that may occur.
    .twoColElsLtHdr #mainContent {
    margin: 0 1.5em 0 13em; /* the right margin can be given in ems or pixels. It creates the space down the right side of the page. */
    color:#069;
    background-color:#FFF;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    .twoColElsLtHdr #mainContent a:link {
    text-decoration: none;
    color: #069;
    .twoColElsLtHdr #mainContent a:visited {
    text-decoration: none;
    color: #069;
    .twoColElsLtHdr #mainContent a:hover {
    text-decoration: underline;
    color: #069;
    background-color:#FFF
    .twoColElsLtHdr #mainContent a:active {
    text-decoration: none;
    color: #069;
    .twoColElsLtHdr #footer {
    padding: 0 10px;
    line-height: 0pt;
    color: #069;
    background-color: #FFF;
    font-size: 10px;
    .twoColElsLtHdr #footer p {
    margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
    padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
    background-color: #FFF;
    /* Miscellaneous classes for reuse */
    .fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
    float: right;
    margin-left: 8px;
    .fltlft { /* this class can be used to float an element left in your page */
    float: left;
    margin-right: 8px;
    .clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
    clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    h1 {
    color: #069;
    font-size: 16px;
    border-top-color: #069;
    border-top-width: thin;
    border-right-width: thin;
    padding-right: 0px;
    padding-left: 0px;
    body,td,th {
    font-family: verdana;
    text-decoration: none;
    color: #069;
    border-top-color: #069;
    border-right-color: #069;
    border-bottom-color: #069;
    border-left-color: #069;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-width: thin;
    border-right-width: thin;
    border-bottom-width: thin;
    border-left-width: thin;
    a:link {
    text-decoration: none;
    color: #FFF;
    a:visited {
    text-decoration: none;
    color: #FFF;
    a:hover {
    text-decoration: underline;
    color: #FFF;
    background-color: #;
    background-repeat: repeat-x;
    background-position: center;
    border-top-color: #069;
    border-right-color: #069;
    border-bottom-color: #069;
    border-left-color: #069;
    a:active {
    text-decoration: none;
    color: #FFF;
    border-color: #FFF;
    padding-left: 20px;
    -->
    </style><!--[if IE]>
    <style type="text/css">
    /* place css fixes for all versions of IE in this conditional comment */
    .twoColElsLtHdr #sidebar1 { padding-top: 30px; }
    .twoColElsLtHdr #mainContent { zoom: 1; padding-top: 15px; }
    /* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
    </style>
    <![endif]-->
    <link href="file:///U|/AFM/Dreamweaver/Left sidebar.css" rel="stylesheet" type="text/css" />
    </head>
    <body link="#006699" class="twoColElsLtHdr">
    <div id="container">
    <div id="header">
        <h1><img src="file:///P|/RPS/AFMS/Quality Management System/QMS Site/HTML/Graphics/menubar/pwgsc-e.gif" width="364" height="33" align="left" alt="wordmark" /><img src="file:///P|/RPS/AFMS/Quality Management System/QMS Site/HTML/Graphics/menubar/wordmark_canada.gif" width="83" height="21" align="right" alt="wordmark2" /></h1>
        <p> </p>
        <p><img src="file:///P|/RPS/AFMS/Quality Management System/QMS Site/HTML/Graphics/menubar/AFM QMS banner.jpg" width="709" height="80" alt="banner" border="0"/><a href="mailto:[email protected]"><img src="file:///P|/RPS/AFMS/Quality Management System/QMS Site/HTML/Graphics/menubar/Contactus-e.JPG" width="110" height="21" alt="contactus-e" border="0" /></a><img src="file:///P|/RPS/AFMS/Quality Management System/QMS Site/HTML/Graphics/menubar/French-e.JPG" width="115" height="21" alt="french-e" border="0" /> <a href="file:///P|/RPS/AFMS/Quality Management System/QMS Site/HTML/Continual Improvement/QMSTeamMembers-e.html"><img src="file:///P|/RPS/AFMS/Quality Management System/QMS Site/HTML/Graphics/menubar/Help-e.JPG" width="115" height="21" alt="help-e" border="0" /> <img src="file:///P|/RPS/AFMS/Quality Management System/QMS Site/HTML/Graphics/menubar/Search-e.JPG" width="115" height="21" alt="search-e" border="0" /></a><a href="http://source.tpsgc-pwgsc.gc.ca"><img src="file:///P|/RPS/AFMS/Quality Management System/QMS Site/HTML/Graphics/menubar/thesource.jpg" width="120" height="21" alt="TheSource" border="0" /> <img src="file:///P|/RPS/AFMS/Quality Management System/QMS Site/HTML/Graphics/menubar/Home-e.jpg" width="104" height="21" alt="home-e" border="0" /></a></p>
        <p> </p>
      </div>
    <div class="twoColElsLtHdr" id="sidebar1">
        <p><a href="../QMS HOME/QMSHome-e.html"><strong>QMS Home</strong></a></p>
        <hr />
        <p><a href="../ABOUTAFM/AboutAFM-e.html"><strong>About AFM</strong></a></p>
    <hr />
    <p><a href="../AdminProcedures/AdminProcedure-e.html"><strong>Administrative Procedures</strong></a></p>
    <hr />
    <p><a href="../BusinessUnits/BusinessUnits-e.html"><strong>Business Units</strong></a></p>
    <hr />
    <p><a href="../POINTSOFINTEREST/pointsofinterest-e.html"><strong>Points Of Interest</strong></a></p>
    <hr />
    <p><a href="../Achievements/Achievements-e.html"><strong>Achievements</strong></a></p>
    <hr />
    <p><strong><a href="../MeasuringPerformance/measuringperformance-e.html">Measuring Performance</a></strong></p>
    <hr />
    <p><a href="../References/references-e.html"><strong>References</strong></a></p>
    <hr />
    <p><a href="file:///P|/RPS/AFMS/Quality Management System/QMS Site/HTML/ContinualImprovement-e.html"><strong>Continual Improvement</strong> </a></p>
    </div>
    <div id="mainContent">
        <h2>Header</h2>
        <p>Paragraph</p>
        <h1>Sub Header </h1>
        <p> </p>
        <h1> </h1>
        <h2> </h2>
        <h1> </h1>
        <p> </p>
        <h2> </h2>
        <!-- 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" />
      </p>
      <div id="footer">
        <hr width="100%" size="8" noshade="noshade" color="#006666" id="color=&quot;069&quot;" colour="#069"/>
        <p><strong>Maintainted by: ASQM </strong></p>
        <p><strong>Date Modified: 2013-03-25</strong></p>
        <!-- end #footer -->
      </div>
      <script type="text/javascript">
    <!--
    //-->
    </script>
      </h3>
        <!-- end #container -->
    </h3>
    </div>
    <script type="text/javascript">
    <!--
    //-->
    </script>
    </body>
    </html>

    I am not suprised, the previous employee tried to recreate the English version of the site in another folder structure and did not change all links and was still using a template in the wrong location.
    I think I created the mess by trying to modify the existing template's non-editable region in order to add a new button. When trying to update all the pages, the fiasco started.
    Do you think the best option would be to create a new template in the correct folder structure and apply it? Would it fix the current pages or will I have to fix them all manualy on by one?
    I understand it is difficult to deal with a newbie of my magnitude and thanks again.

  • Adding text to editable region creates space in the rest of my layout

    I created my layout in PS, sliced the images and then imported to DW (html and images).
    Layout looks great.
    I created editable regions in the template I created from the .html
    One I start inserting text into these regions, my container moves and it throws the rest of the layout off by adding space between the editable region and the area above it (a big black line horizontally through the page).
    Is there a way to keep the container/editable region from moving or growing with the text so that it doesn't change my layout?
    On a side note, this change doesn't appear in live view. When I preview in browser, Safari layout looks great, but text doesn't appear. In firefox, text appears, but layout is a mess.
    Here is the code from the editable region to which I am trying to add text:
    <!-- TemplateBeginEditable name="main_content_area" -->
            <div id="site_layout_contentmain">Content for  id "site_layout_contentmain" Goes Here</div>
          <!-- TemplateEndEditable --></td>
    ANY help is GREATLY appreciated!!!!!

    MHarvey2001 wrote:
    Yes, the design is appearing to pull apart when I add content, but only in the Firefox preview.
    If it pulls apart in Firefox, chances are it pulls apart in all browsers when text size is increased.
    The problem with Photoshop code is that it is a) rigid, b) unstable and c) invalid.  
    To illustrate, run your code through the on-line validation tools below.
    CSS - http://jigsaw.w3.org/css-validator/
    HTML - http://validator.w3.org/
    Photoshop is OK for designing quick comps to show the client but they won't hold up on a real site.
    IMO, the benefits of starting over far outweigh the inconvenience.
    HTML & CSS Tutorials - http://w3schools.com/
    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics | Print | Media  Specialists 
    http://alt-web.com/
    http://twitter.com/altweb
    http://alt-web.blogspot.com/

  • Can a div be an editable region in a template?

    This is my first attempt to work with templates. I have a main area in the center of the page where I want to be able to adjust font-size, and perhaps other text properties. I use a div called "textbox" I set it up as an editable region, but every time I try to change font-size, I am told that this is an uneditable region and the change will be discarded. Here is the code in my program:
    <!-- InstanceBeginEditable name="textbox" -->
        <div id ="textbox">
          <p>Here is some text in the box</p>
          <p> </p>
        </div>
        <!-- InstanceEndEditable -->
    Any suggestions?

    Okay - all is well.  Yet again I find myself spend as much or more time in Code view, than Design view. With the cursor inbetween a couple of divs, I could make it editable.  I found in a couple of cases the editable region was stuck in an odd random place in the page - Code view helped me figure it out.
    <div id="mainContent">
      <!-- InstanceBeginEditable name="mainContent" -->
    /* all the below is editable */
    <div id="featureBox1"><h3>Feature box one</h3>
        <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>
        </div><div id="featureBox2"><h3>Feature box two</h3>
        <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>
        </div>
    /* all the above is editable */
    <!-- InstanceEndEditable --> 
      </div><!-- end #mainContent -->

  • Can't edit 2nd editable region

    Hi,
    I have a template which uses CSS and DIVs. It has 2 editable
    regions, each within a DIV.
    When I open a document based on this template, for some
    reason only the first editable region is editable. The only way I
    can edit the second is to turn of styles or go into code view.
    Any ideas why?

    > That's just being picky.
    > It makes no difference whether it is absolute or
    relative - it doesn't
    > work
    > either way!
    Well, for it to be a layer, it has to be absolutely
    positioned, and the
    difference in behavior between the two (absolute vs.
    relative) is certainly
    NOT picky.
    Remove the overflow:auto style on the div#main container, and
    you'll be able
    to edit it in Design view.
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.dreamweavermx-templates.com
    - Template Triage!
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    http://www.macromedia.com/support/search/
    - Macromedia (MM) Technotes
    ==================
    "mrdebauchery" <[email protected]> wrote in
    message
    news:[email protected]...
    > That's just being picky.
    > It makes no difference whether it is absolute or
    relative - it doesn't
    > work
    > either way!
    >
    > Code attached, with crap cut out.
    >
    >
    > <!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"
    lang="en-gb">
    > <head>
    > <meta http-equiv="Content-Type" content="text/html;
    charset=iso-8859-1" />
    > <!-- TemplateBeginEditable name="doctitle" -->
    > <title>Title</title>
    > <!-- TemplateEndEditable --><!--
    TemplateBeginEditable name="head" --><!--
    > TemplateEndEditable -->
    > <style>
    > body,td,th {
    > font-family: Times New Roman, Times, serif;
    > font-size: 16px;
    > color: #000000;
    > line-height: 105%;
    > }
    > body {
    > background-color: #FFFFFF;
    > margin-left: 0px;
    > margin-top: 0px;
    > margin-right: 0px;
    > margin-bottom: 0px;
    > }
    > a:link {
    > color: #0066CC;
    > }
    > a:visited {
    > color: #0066CC;
    > }
    > a:hover {
    > color: #006699;
    > }
    > a:active {
    > color: #006699;
    > }
    > h1, h2, h3, h4, p {
    > padding: 0px 0px 20px 0px;
    > margin: 0px;
    > }
    > h1 {
    > font-size: 24px;
    > color: #4376BD;
    > }
    > h2 {
    > font-size: 20px;
    > color: #4376BD;
    > }
    > h3 {
    > font-size: 16px;
    > color: #4376BD;
    > }
    > h4 {
    > font-size: 14px;
    > }
    >
    > #container {
    > width:760px;
    > margin: auto;
    > overflow:visible;
    > }
    >
    > #topbar {
    > position:relative;
    > width:760px;
    > height:104px;
    > background-image: url(images/topbar.jpg);
    > background-repeat: no-repeat;
    > overflow: hidden;
    > }
    > #title {
    > float: left;
    > width: 325px;
    > z-index: 2;
    > }
    > #pics {
    > float: right;
    > z-index: 2;
    > }
    > #pics img {
    > margin: 4px 10px 4px 0px;
    > border: #ffffff 1px solid;
    > }
    > #middle {
    > position:relative;
    > width:754px;
    > overflow: auto;
    > border-right: #006699 3px solid;
    > border-left: #006699 3px solid;
    > min-height:489px;
    > background:url(images/lines.gif) repeat-y;
    > }
    >
    > #menu {
    > position:relative;
    > width:194px;
    > min-height:465px;
    > float: left;
    > border-right: #006699 3px solid;
    > padding: 15px 0px 0px 0px;
    > text-align: center;
    > overflow: auto;
    > }
    >
    > #links {
    > width: 134px;
    > height: 320px;
    > border: #0276C0 1px solid;
    > background-color: #DCF4F8;
    > margin: 30px auto 15px auto;
    > text-align: center;
    > color: #0276C0;
    > font-size: 18px;
    > padding: 0px 6px 0px 6px;
    > }
    >
    > #links ul {
    > list-style: none;
    > margin: 0px;
    > padding: 0px;
    > }
    >
    > #links ul li {
    > padding: 29px 0px;
    > margin: 0px;
    > }
    >
    > #links ul li a {
    > text-decoration: none;
    > }
    >
    > #main {
    > position:relative;
    > width:512px;
    > min-height:450px;
    > float: left;
    > overflow: auto;
    > padding: 25px 15px 15px 30px;
    > text-align: left;
    > line-height: 105%;
    > }
    >
    > #botbar {
    > position:relative;
    > width:760px;
    > height:14px;
    > background-image: url(images/botbar.jpg);
    > background-repeat: no-repeat;
    > overflow: hidden;
    > }
    > .small {
    > font-size: 10px;
    > padding: 0px 0px 5px 0px;
    > line-height: 12px;
    > }
    >
    > </style>
    > </head>
    > <body>
    > <div id="container">
    > <div id="topbar">
    > <div id="title"><!-- TemplateBeginEditable
    name="title" --><img
    > width="325"
    > height="104" /><!-- TemplateEndEditable
    --></div>
    > <div id="pics"><!-- TemplateBeginEditable
    name="pics" --><img width="66"
    > height="89" /><img width="66" height="89"
    /><img width="66" height="89"
    > /><img
    > width="66" height="89" /><!-- TemplateEndEditable
    --></div>
    > </div>
    > <div id="middle">
    > <div id="menu"> <img width="190" height="85"
    />
    > <div id="links">
    > <ul>
    > <li> </li>
    > <li> </li>
    > <li> </li>
    > <li> </li>
    > </ul>
    > </div>
    > <p class="small"> </p>
    > </div>
    > <div id="main"> <!-- TemplateBeginEditable
    name="MainBody" -->
    > <h1>Heading 1</h1>
    > <p>Paragraph</p>
    > <h2>Heading 2</h2>
    > <p>Paragraph</p>
    > <h3>Heading 3</h3>
    > <p>Paragraph</p>
    > <p>Paragraph</p>
    > <!-- TemplateEndEditable --> </div>
    > </div>
    > <div id="botbar"> </div>
    > <p> </p>
    > </div>
    > </body>
    > </html>
    >

  • Resetting editable region width (DW CS 4)

    Have had an editable region set to the width I want, matching a fixed centered region - 1,180 px.
    As I am updating website, it's now expanded toward the right-hand side as 161%, 1,895 px.- making items and text centered in to run off the side, both in Dreamweaver views and on the website itself. (I think it may have to do with when I inserted images and they set side by side, before I <br>'ed them to stack them - but it didn't happen until a period of time after I had)
    I am unable to find where and how to reset the editable region's width.
    Thanks for any help,
    Lawrence Congdon.

    >I am unable to find where and how to reset the editable region's width.
    There's no such thing. A DW Editable region is simply DW code that controls what section you can and cannot edit in a DW template based child page. Any width is controlled by the markup or content you have placed within that region.

  • DWCS3 Template Editable Regions and Editable Attributes?

    Using DWCS3 / WIN XP
    New to DWCS3 and templates AND CSS but I'm managing I
    think....
    QUESTION:
    is there a way to allow the end user to edit the content of
    an editable region and also the attributes of the cell in which the
    editable region resides?
    SITUATION:
    I'm building templates for pages (styled with external CSS)
    that will be editable by the end user via Contribute. I've put
    editable and repeating regions (imgs and navigation menus) in
    particular tds and would like the end user to be able to change the
    color of the background of the cells in which the editable regions
    reside.....
    Of course I get "cannot place an editable region inside an
    editable region" .......understandable...i've read more than a few
    help/tutorial docs......
    So I thought that I should click the tag selector for that td
    and Make Attribute Editable.....
    That's not working either....I know I'm missing something
    because I haven't used DW in years and I'm just not getting some
    big picture logic......
    EXAMPLE: In the .html page attached for viewing, the upper
    left image SRC is in an editable region. I would like the
    background color of the cell it is in to be editable as well. Same
    goes for the background color of the left navigation menu which
    resides in a nested table by the way...........but i still want the
    color to be editable.....
    Thanks so much for any help you can give....
    CoCo
    PAGE based on Template:
    http://www.methods.com/npsbweb/schools/NPSB_school_lev_1.html
    CSS and TEMPLATE CODE: BELOW
    @charset "utf-8";
    p {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10pt;
    font-weight: normal;
    h1 {
    font-size: 16px;
    color: #999966;
    font-family: "Times New Roman", Times, serif;
    h2 {
    font-size: 18px;
    color: #333366;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    text-align: center;
    margin: 0px;
    h3 {
    font-size: 14px;
    color: #333366;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    h4 {
    font-size: 12pt;
    color: #999966;
    font-family: "Times New Roman", Times, serif;
    text-align: center;
    letter-spacing: 1px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 5px;
    margin-left: 0px;
    h5 {
    font-size: 12px;
    color: #999966;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    h6 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 8pt;
    color: #333366;
    text-align: center;
    #tdDivideLineTop {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #999966;
    height: 2px;
    #tdMainImgTop {
    text-align: center;
    vertical-align: middle;
    height: 175px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #D5D5AA;
    background-color: #ffffff;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #D5D5AA;
    #tdTitleRow {
    height: 175px;
    vertical-align: middle;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #D5D5AA;
    #tdRightLineTop {
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #CACAFF;
    #tdMainNavigation {
    display: block;
    font-size: 9pt;
    background-color: #D5D5AA;
    #tdRightNavigation {
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #D5D5AA;
    background-color: #FFFFFF;
    #tdMainNavigation a:link {
    color: #333366;
    text-decoration: none;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9pt;
    text-align: center;
    vertical-align: middle;
    margin: 25px;
    padding: 2px;
    display: block;
    border-left-style: solid;
    border-left-width: 1px;
    border-left-color: #333366;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #333366;
    background-color: #FFFFFF;
    #tdMainNavigation a:visited {
    color: #333366;
    text-decoration: none;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9pt;
    text-align: center;
    vertical-align: middle;
    margin: 25px;
    padding: 2px;
    display: block;
    border-left-style: solid;
    border-left-width: 1px;
    border-left-color: #333366;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #333366;
    background-color: #FFFFFF;
    #tdMainNavigation a:hover {
    color: #FFFFFF;
    text-decoration: none;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9pt;
    text-align: center;
    vertical-align: middle;
    display: block;
    margin: 25px;
    padding: 2px;
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #333366;
    background-color: #999966;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #333366;
    #tdMainNavigation a:active {
    color: #333366;
    text-decoration: none;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9pt;
    text-align: center;
    vertical-align: middle;
    display: block;
    margin: 25px;
    padding: 2px;
    font-weight: normal;
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #333366;
    background-color: #D5D5AA;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #333366;
    #tdRightNavigation a:link {
    font-family: "Times New Roman", Times, serif;
    font-size: 9pt;
    font-variant: normal;
    color: #999900;
    text-decoration: underline;
    text-align: center;
    display: block;
    margin: 0px;
    letter-spacing: 1px;
    float: none;
    line-height: 22px;
    #tdRightNavigation a:visited {
    font-family: "Times New Roman", Times, serif;
    font-size: 9pt;
    font-variant: normal;
    color: #999900;
    text-decoration: underline;
    text-align: center;
    display: block;
    margin: 0px;
    letter-spacing: 1px;
    float: none;
    line-height: 22px;
    #tdRightNavigation a:hover {
    font-family: "Times New Roman", Times, serif;
    font-size: 9pt;
    font-variant: normal;
    color: #333399;
    text-decoration: underline;
    text-align: center;
    display: block;
    margin: 0px;
    letter-spacing: 1px;
    float: none;
    line-height: 22px;
    #tdRightNavigation a:active {
    font-family: "Times New Roman", Times, serif;
    font-size: 9pt;
    font-variant: normal;
    color: #666633;
    text-decoration: underline;
    text-align: center;
    display: block;
    margin: 0px;
    letter-spacing: 1px;
    float: none;
    line-height: 22px;
    body {
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    a {
    font-size: 10pt;
    color: #333366;
    a:visited {
    color: #330066;
    a:hover {
    color: #999966;
    a:active {
    color: #999900;
    body,td,th {
    font-size: 10pt;

    Using DWCS3 / WIN XP
    New to DWCS3 and templates AND CSS but I'm managing I
    think....
    QUESTION:
    is there a way to allow the end user to edit the content of
    an editable region and also the attributes of the cell in which the
    editable region resides?
    SITUATION:
    I'm building templates for pages (styled with external CSS)
    that will be editable by the end user via Contribute. I've put
    editable and repeating regions (imgs and navigation menus) in
    particular tds and would like the end user to be able to change the
    color of the background of the cells in which the editable regions
    reside.....
    Of course I get "cannot place an editable region inside an
    editable region" .......understandable...i've read more than a few
    help/tutorial docs......
    So I thought that I should click the tag selector for that td
    and Make Attribute Editable.....
    That's not working either....I know I'm missing something
    because I haven't used DW in years and I'm just not getting some
    big picture logic......
    EXAMPLE: In the .html page attached for viewing, the upper
    left image SRC is in an editable region. I would like the
    background color of the cell it is in to be editable as well. Same
    goes for the background color of the left navigation menu which
    resides in a nested table by the way...........but i still want the
    color to be editable.....
    Thanks so much for any help you can give....
    CoCo
    PAGE based on Template:
    http://www.methods.com/npsbweb/schools/NPSB_school_lev_1.html
    CSS and TEMPLATE CODE: BELOW
    @charset "utf-8";
    p {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10pt;
    font-weight: normal;
    h1 {
    font-size: 16px;
    color: #999966;
    font-family: "Times New Roman", Times, serif;
    h2 {
    font-size: 18px;
    color: #333366;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    text-align: center;
    margin: 0px;
    h3 {
    font-size: 14px;
    color: #333366;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    h4 {
    font-size: 12pt;
    color: #999966;
    font-family: "Times New Roman", Times, serif;
    text-align: center;
    letter-spacing: 1px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 5px;
    margin-left: 0px;
    h5 {
    font-size: 12px;
    color: #999966;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    h6 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 8pt;
    color: #333366;
    text-align: center;
    #tdDivideLineTop {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #999966;
    height: 2px;
    #tdMainImgTop {
    text-align: center;
    vertical-align: middle;
    height: 175px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #D5D5AA;
    background-color: #ffffff;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #D5D5AA;
    #tdTitleRow {
    height: 175px;
    vertical-align: middle;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #D5D5AA;
    #tdRightLineTop {
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #CACAFF;
    #tdMainNavigation {
    display: block;
    font-size: 9pt;
    background-color: #D5D5AA;
    #tdRightNavigation {
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #D5D5AA;
    background-color: #FFFFFF;
    #tdMainNavigation a:link {
    color: #333366;
    text-decoration: none;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9pt;
    text-align: center;
    vertical-align: middle;
    margin: 25px;
    padding: 2px;
    display: block;
    border-left-style: solid;
    border-left-width: 1px;
    border-left-color: #333366;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #333366;
    background-color: #FFFFFF;
    #tdMainNavigation a:visited {
    color: #333366;
    text-decoration: none;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9pt;
    text-align: center;
    vertical-align: middle;
    margin: 25px;
    padding: 2px;
    display: block;
    border-left-style: solid;
    border-left-width: 1px;
    border-left-color: #333366;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #333366;
    background-color: #FFFFFF;
    #tdMainNavigation a:hover {
    color: #FFFFFF;
    text-decoration: none;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9pt;
    text-align: center;
    vertical-align: middle;
    display: block;
    margin: 25px;
    padding: 2px;
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #333366;
    background-color: #999966;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #333366;
    #tdMainNavigation a:active {
    color: #333366;
    text-decoration: none;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9pt;
    text-align: center;
    vertical-align: middle;
    display: block;
    margin: 25px;
    padding: 2px;
    font-weight: normal;
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #333366;
    background-color: #D5D5AA;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #333366;
    #tdRightNavigation a:link {
    font-family: "Times New Roman", Times, serif;
    font-size: 9pt;
    font-variant: normal;
    color: #999900;
    text-decoration: underline;
    text-align: center;
    display: block;
    margin: 0px;
    letter-spacing: 1px;
    float: none;
    line-height: 22px;
    #tdRightNavigation a:visited {
    font-family: "Times New Roman", Times, serif;
    font-size: 9pt;
    font-variant: normal;
    color: #999900;
    text-decoration: underline;
    text-align: center;
    display: block;
    margin: 0px;
    letter-spacing: 1px;
    float: none;
    line-height: 22px;
    #tdRightNavigation a:hover {
    font-family: "Times New Roman", Times, serif;
    font-size: 9pt;
    font-variant: normal;
    color: #333399;
    text-decoration: underline;
    text-align: center;
    display: block;
    margin: 0px;
    letter-spacing: 1px;
    float: none;
    line-height: 22px;
    #tdRightNavigation a:active {
    font-family: "Times New Roman", Times, serif;
    font-size: 9pt;
    font-variant: normal;
    color: #666633;
    text-decoration: underline;
    text-align: center;
    display: block;
    margin: 0px;
    letter-spacing: 1px;
    float: none;
    line-height: 22px;
    body {
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    a {
    font-size: 10pt;
    color: #333366;
    a:visited {
    color: #330066;
    a:hover {
    color: #999966;
    a:active {
    color: #999900;
    body,td,th {
    font-size: 10pt;

  • Editable regions in templates. How do I edit the CSS in a new page from the template?

    I am new to Dreamweaver and Web design. I have made a template and have two editable regions they work fine. When I create a page from this template, I can't edit the CSS. What do I need to do to edit the div tags that are specific to the editable regions? Thank you, I appreciate any help I am just about to give up with templates.

    Hi, thank you here is my code. Maybe I am trying to do too much advanced stuff to soon!
    <!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>Untitled Document</title>
    <!-- TemplateEndEditable -->
    <link href="file:///C|/Users/Roxane/Desktop/Brown County Indiana/images/favicon.ico" rel="shortcut icon"/>
    <!--jquery -->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript" src="file:///C|/Users/Roxane/Desktop/brown county indiana/scripts/automanualslideshow.js"></script>
    </script>
    <!-- End jquery-->
    <style type="text/css">
    #container {
        width: 960px;
        margin-right: auto;
        margin-left: auto;
    #header {
        height: 80px;
        width: 100%;
        background-color: #222;/*Some browsers will not recognize RGBA colors*/
        background-color: rgba(0,0,0,0.6);/*RGBA fourth value for opacity, if there are two rules that apply to the same element, the latter of the two takes priority.*/
    .jld_logo {
        float: left;
        padding-left: 70px;
        display: block;
        padding-top: 10px;
    #navigation {
        height: 27px;
        width: 100%;
        background-color: #C00;
        margin-left: 0px;
        padding-left: 0px;
        padding-right: 0px;
        left: 0px;
        color: #FFF;
        background: rgb(192,0,0); /* Old browsers */
        background: -moz-linear-gradient(top,  rgba(192,0,0,1) 0%, rgba(144,0,0,1) 51%, rgba(144,0,0,1) 56%, rgba(192,0,0,1) 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(192,0,0,1)), color-stop(51%,rgba(144,0,0,1)), color-stop(56%,rgba(144,0,0,1)), color-stop(100%,rgba(192,0,0,1))); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top,  rgba(192,0,0,1) 0%,rgba(144,0,0,1) 51%,rgba(144,0,0,1) 56%,rgba(192,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top,  rgba(192,0,0,1) 0%,rgba(144,0,0,1) 51%,rgba(144,0,0,1) 56%,rgba(192,0,0,1) 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top,  rgba(192,0,0,1) 0%,rgba(144,0,0,1) 51%,rgba(144,0,0,1) 56%,rgba(192,0,0,1) 100%); /* IE10+ */
        background: linear-gradient(top,  rgba(192,0,0,1) 0%,rgba(144,0,0,1) 51%,rgba(144,0,0,1) 56%,rgba(192,0,0,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c00000', endColorstr='#c00000',GradientType=0 ); /* IE6-9 */
    #sideleft {
        float: left;
        width: 19.0%;
        font-family: eurofurence, "Tekton Pro", Tahoma, sans-serif;
        font-size: 18px;
        font-weight: bold;
        color: #FFF;
        background-color: #222;/*Some browsers will not recognize RGBA colors*/
        background-color: rgba(0,0,0,0.6);/*RGBA fourth value for opacity, if there are two rules that apply to the same element, the latter of the two takes priority.*/
        text-align: center;
        height: 300px;
        border-radius: 10px;
        border:1px solid #888;
        padding-top: 0px;
        margin-top: 25px;
    .mywork {
        font-family: eurofurence, "eurofurence light", tahoma, sans-serif;
        font-size: 30px;
        font-style: normal;
        font-weight: bold;
        font-variant: normal;
        text-transform: none;
        color: #C00;
        text-align: center;
        line-height: 60px;
    .categoriessmall {
        font-family: eurofurence, "eurofurence light", tahoma, sans-serif;
        font-size: 16px;
        font-style: normal;
        line-height: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: uppercase;
        color: #FFF;
        text-align: left;
        display: block;
        margin-left: 15px;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-bottom-color: #C00;
        margin-right: 10px;
    .sideleft-text {
        padding-top: 75px;
    a.sideleft, a.sideleft:link, a.sideleft:visited {
        display:block;
        margin-top:4px;
        text-align:left;
        text-decoration:none;
        font-family:eurofurence, "eurofurence light", tahoma, sans-serif;
        font-size:14px;
        color:#FFF;
        line-height:20px;
        overflow:hidden;
        border-top-style: none;
        border-right-style: none;
        border-bottom-style: none;
        border-left-style: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        margin-left: 15px;
        white-space: nowrap;
    a.sideleft:hover {
        color:#999;
    a.sideleft:active {
        color:#C00;
    #mainright {
        float: right;
        width: 75.5%;
        font-family: eurofurence, "eurofurence light", tahoma, sans-serif;
        color: #FFF;
        text-decoration: none;
        height: 700px;
        text-align: left;
        background-color: #000000;/*Some browsers will not recognize RGBA colors*/
        background-color: rgba(0,0,0,0.6);
        margin-left: 0px;
        margin-top: 25px;
        margin-right: 0px;
        margin-bottom: 10px;
        border-radius: 10px;
        border:1px solid #888;
        z-index: -3;
        padding: 0px;
    .categories {
        font-family: eurofurence, "eurofurence light", tahoma, sans-serif;
        font-size: 36px;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: uppercase;
        color: #808080;
        text-decoration: none;
        border-bottom-width: 2px;
        border-bottom-style: solid;
        border-bottom-color: #C00;
        float: none;
        position: relative;
        clear: none;
        left: 0px;
        z-index: auto;
        margin-right: 50px;
        margin-left: 20px;
    .img
        height:auto;
        width:auto;
        float:left;
        text-align:center;
        border-top-style: none;
        border-right-style: none;
        border-bottom-style: none;
        border-left-style: none;
        color: #FFF;
        font-family: eurofurence, "eurofurence light", tahoma, sans-serif;
        font-size: 18px;
        padding: 0px;
        margin-top: 0px;
        margin-right: 10px;
        margin-bottom: 0px;
        margin-left: 10px;
    .img img
        display:inline;
        margin:10px;
        border:1px solid #333;
    .img a:hover img
        border:1px solid #900;
    .image desc
        text-align:center;
        font-weight:normal;
        width:120px;
        margin:2px;
        font-family: eurofurence, "eurofurence light", tahoma, sans-serif;
        font-size: 16px;
        color: #FFF;
        text-decoration: none;
        font-style: normal;
        line-height: normal;
        font-variant: normal;
        text-transform: none;
    #footer {
        clear: both;
        width: 100%;
        font-family: eurofurence, "Tekton Pro", Tahoma, sans-serif;
        font-size: 12px;
        font-style: normal;
        font-weight: normal;
        text-align: center;
        margin-left: 0px;
        color: #FFF;
        margin-bottom: 0px;
        margin-top: 10px;
        padding-left: 10%;
        padding-right: 15px;
    body {
        background-image: url(../images/background_large.jpg);
    </style>
    </script>
    <script src="../spryassets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="../spryassets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <link href="../styles/automanualslideshow.css" rel="stylesheet" type="text/css" />
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    </head>
    <body>
    <div id="container">
      <div id="header">
      <div class="jld_logo">
      <a href="file:///C|/Users/Roxane/Desktop/index.html">
      <img src="../images/jeff_danielson_logo_reverse.png" alt="Jeff Danielson logo" name="jld_logo" width="60" height="60" id="jld_logo" longdesc="images/jeff_danielson_logo_reverse.png" />
        </a>
      </div></div>
      <div id="navigation">
        <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a href="#">Home</a>      </li>
          <li><a href="#" class="MenuBarItemSubmenu">About Jeff</a>
            <ul>
              <li><a href="#">Biography</a></li>
              <li><a href="#">News</a></li>
            </ul>
          </li>
          <li><a class="MenuBarItemSubmenu" href="#">My Work</a>
            <ul>
              <li><a href="file:///C|/Users/Roxane/Desktop/recent_photographs.html">Recent Photographs</a></li>
            <li><a href="file:///C|/Users/Roxane/Desktop/flowers_leaves_moss.html">Flowers/Leaves/Moss</a></ li>
            <li><a href="file:///C|/Users/Roxane/Desktop/forests_trees_valleys.html">Forests/Trees/Valleys</ a></li>
            <li><a href="file:///C|/Users/Roxane/Desktop/deer_dogs_creatures.html">Deer/Dogs/Creatures</a></ li>
            <li><a href="file:///C|/Users/Roxane/Desktop/lakes_rivers_streams.html">Lakes/Rivers/Streams</a> </li>
            <li><a href="file:///C|/Users/Roxane/Desktop/clouds_skis_fog.html">Clouds/Skies/Fog</a></li>
            <li><a href="file:///C|/Users/Roxane/Desktop/birds_butterflys_insects.html">Birds/Butterflys/Ins ects</a></li>
            <li><a href="file:///C|/Users/Roxane/Desktop/panoramas.html">Panoramas</a></li>
            <li><a href="file:///C|/Users/Roxane/Desktop/fall_winter_spring_summer.html">Fall/Winter/Spring/ Summer</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">Pricing</a>
            <ul>
              <li><a href="#url">Size</a></li>
            <li><a href="#url">Mats</a></li>
            <li><a href="#url">Frames</a></li>
            <li><a href="#url">Frames & Mats</a></li>
            </ul>
          </li>
          <li><a href="#">Contact</a></li>
          <li><a href="#" class="MenuBarItemSubmenu">Runciple Spoon</a>
            <ul>
              <li><a href="#">The 1970's</a></li>
              <li><a href="#">The 1980's</a></li>
              <li><a href="#">The 1990's</a></li>
              <li><a href="#">The 2000's</a></li>
            </ul>
          </li>
        </ul>
      </div>
      <!-- TemplateBeginEditable name="Sideleft" -->
      <div id="sideleft"> <span class="mywork">My Work</span> <span class="categoriessmall">Categories</span> <a class="sideleft" href="../recent_photographs.html" title="">Recent Photographs</a> <a class="sideleft" href="../flowers_leaves_moss.html" title="Flowers/Leaves/Moss">Flowers/Leaves/Moss</a> <a class="sideleft" href="../Forests/Trees/Valleys.html" title="Forests/Trees/Valleys">Forests/Trees/Valleys</a> <a class="sideleft" href="../Deer/Dogs/Creatures.html" title="Deer/Dogs/Creatures">Deer/Dogs/Creatures</a> <a class="sideleft" href="../Lakes/Rivers/Streams.html" title="Lakes/Rivers/Streams">Lakes/Rivers/Streams</a> <a class="sideleft" href="../Clouds/Skies/Fog.html" title="Clouds/Skies/Fog">Clouds/Skies/Fog</a> <a class="sideleft" href="../Birds/Butterflys/Insects.html" title="Birds/Butterflys/Insects">Birds/Butterflys/Insects</a> <a class="sideleft" href="../Panoramas.html" title="Panoramas">Panoramas</a> <a class="sideleft" href="../Fall/Winter/Spring/Summer.html" title="Fall/Winter/Spring/Summer">Fall/Winter/Spring/Summer</a></div>
      <!-- TemplateEndEditable --><!-- TemplateBeginEditable name="Mainright" -->
      <div id="mainright"></div>
      <!-- TemplateEndEditable -->
      <div id="footer">
      © 2012 Jeff Danielson Brown County Indiana Photography</div>
    <!--Content for container goes here--></div>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    </html>

  • Edit region teal colour tag "editableregion" is messing up layout.

    Hi I have developed a Photoshop layout.
    I carved up vertical menu bar (6 options) and made three different buttons for different states. up down pressed
    so I can calculate 6 x button height (52) and 138 width.
    So i have an area of   312 x 138
    So I create a slice of this size.
    So i save for web
    Now when in dreamweaver i create template ..
    Now for the navigation area of size  312 x 138  i create a div and then i insert a editable region.
    I get a bulky teal coloured tag at top
    Finally i create my navigation bar and insert 6 images. ... but the bottom is being push by what seems to be the height of the bulky tag.
    Any suggestions please

    Sure, you can turn off the invisible items, and turn them back on when you need them. Go to View > Visual Aids > Invisible Elements and turn them off.
    They only mess up the Design View, they should not be messing up your actual Live View or Browser View.
    Beth

  • Dreamweaver template giving up "instancebegineditable tag inside editable region" error

    I have been searching the internet and any forum I can find relating to Dreamweaver and find it has been a comman problem for a lot of people but the solutions they got have not helped me. I created a template by following steps via a helpvid.net tutorial and the site looked very good for being basic enough but since last night when I try save the template it gives up the error "there is an error at line 8, column 47 (absolute position 789) of "file address": InstanceBeginEditable tag inside editable region." Now from what I have read on the forums it usually means there is a mispelling or something placed inside the region when it shouldn't be but there is only 50 odd lines on it and can't see any problem. When I view the files it gives the error about, there are duplications of the "begin editable region" a number of times but they shouldn't be there because they aren't on the template. Im also finding that before this error came up the pages looked fine when uploaded but now the footer height which was set to 20px is 200px when uploaded and I have checked all coding for it and checked the Divs but still see no error. I have uploaded my tempalete and some of the pages that its giving errors about to see if that helps, not sure if its best to just paste wall of coding so ill post links to the files and if code needs to be pasted here ill do so. http://dublinmoulding.com/ <- site im working on, it can be seen the footer is very big. Should be 20px height but inspect element shows its 200px - #wrapper #footer {     color: #FFF;     height: 200px; On the template it is #wrapper #footer {     color: #FFF;     text-align: center;     margin: 0px;     font-size: 18px;     font-style: normal;     font-weight: lighter;     font-family: Arial, Helvetica, sans-serif;     padding-top: 5px;     padding-right: 0px;     padding-bottom: 5px;     padding-left: 0px;     height: 20px; http://dublinmoulding.com/dreamweaver/temp1.dwt <- my tempalate The error is given up on every page created using the template
    **Update**  I edited the file names of some of the pages that I used the template on so now it shows the coding.
    http://dublinmoulding.com/dreamweaver/index.html6  <- my index page
    http://dublinmoulding.com/dreamweaver/about.html6 <-about page

    No need for tricks.  We can view source code directly from our browsers or with Inspect Element.
    Like I said, I don't see any code errors in your Template or child pages. 
    If DW continues to display errors,  the first thing to try is Deleting Corrupted Cache in DW
    http://forums.adobe.com/thread/494811
    If that doesn't help, try Restore Preferences
    http://helpx.adobe.com/dreamweaver/kb/restore-preferences-dreamweaver-cs4-cs5.html
    Nancy O.

  • Editable Regions - Having Issues.

    I have some editable regions on my site - and the elongate my
    document into something deeper than I intended in my layouts. Why
    does this happen?
    Also, is there any way to fix BOTH width and depth of a
    table? I can only see a width setting.
    Thanks for any help!!!
    Hugh

    Template regions are not layout tools. They cannot affect the
    layout of
    your page since they are just HTML comment tags - not
    rendered by the
    browser. The page's layout only depends on the renderable
    HTML. In other
    words you would have the same problem on your page even if
    there were no
    templates involved - this means that the page's
    infrastructure, itself, is
    what's allowing it to become misshapen.
    > Also, is there any way to fix BOTH width and depth of a
    table? I can only
    > see
    > a width setting.
    You cannot really fix either. A table will always expand to
    fit the shape
    of its contents. It sounds to me as if you have built your
    table with
    Layout Mode (or used FW to write the HTML), because this kind
    of problem is
    the guaranteed consequence of that. Can you show us the page
    by uploading
    it and posting a link to the uploaded file, please?
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    ==================
    "Hugh Anderson" <[email protected]> wrote in
    message
    news:fekfsi$ibb$[email protected]..
    >I have some editable regions on my site - and the
    elongate my document into
    > something deeper than I intended in my layouts. Why does
    this happen?
    >
    > Also, is there any way to fix BOTH width and depth of a
    table? I can only
    > see
    > a width setting.
    >
    > Thanks for any help!!!
    >
    > Hugh
    >

Maybe you are looking for