Beginners CSS layout question - expanding a layer and not overlapping another

Having got well and truly fed up of using tables to layout
pages I am trying to gem up on CSS layer based layout. All well and
good but despite the various tutorials I can't find an answer to
this question...
Q. I have a layout with layers to make a three column layout,
however, I want to have a footer section at the bottom of the page
that runs the same width as the three columns (you can see my WIP
example here
http://www.spiralfilm.com/clients/broadoak/index_css.html
). Problem is, as the centre section expands with more content, how
do I make that section expand and not overrun the current footer
section? I want it to expand like a table does and push the footer
down.
I'm sure it is simple but I just can't get my head around it!
Thanks in advance for any pointers...

> However, is the use of div tags the way to seperate
blocks of content? The
> DW8
> help file seems a little unclear on this?
Yes, it would be one way to do that. A div tag is simply a
container for
other HTML elements, like a table. The problem you are having
comes with
using DW 'layers' to contain text. As Thierry suggested, this
is because
absolutely positioned elements (i.e., DW 'layers') are
removed from the
normal flow, preventing them from interacting with adjacent
page elements -
this means that when the text inside them expands, it will
begin to overlap
other content. See my demonstration of this here -
http://www.great-web-sights.com/g_layers-overlap.asp
Try these tutorials -
http://www.macromedia.com/devnet/mx/dreamweaver/css.html
http://www.macromedia.com/devnet/dreamweaver/articles/tableless_layout_dw8.html
http://www.macromedia.com/devnet/dreamweaver/articles/css_concepts.html
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
==================
"Benfrain" <[email protected]> wrote in
message
news:elgpba$qds$[email protected]..
> Hi, thanks for those links. Sorry to confess they are
all a little beyond
> my
> knowledge. I will read on and see if I can understand
them.
>
> However, is the use of div tags the way to seperate
blocks of content? The
> DW8
> help file seems a little unclear on this?
>

Similar Messages

  • When I click "File" and then "New" it keeps opening a new file as a layer and not a background. RGB is selected as the mode.

    When I click "File" and then "New" it keeps opening a new file as a layer and not a background. RGB is selected as the mode.
    With new files opening as a layer and not a background I'm not able to create multiple layers and it wont let me convert the layer to the background.
    How did this happen. I used PS just yesterday and had no problems. Today my computer did mandatory updates and now this.

    Yes. You are using the Ellipse Tool's Pixel option. So it is laying down pixels as it is supposed to do without creating a layer.
    Choose the Shape option:
    Also Layer menu > New Layer creates layers and the curled paper at the bottom of your Layers palette also creates a New Layer. I hope those work.

  • Why is my airportxpr only working with Itunes and not with another music program

    why is my airportxpr only working with Itunes and not with another music program??
    I can not select/see other outputs in my sound selector.

    You have not indicated which OS or which music program you have so I have listed a program called Airfoil to try for both Windows and Mac - it may work for you
    for Windows - http://rogueamoeba.com/airfoil/windows/
    for Mac - http://rogueamoeba.com/airfoil/mac/

  • Another CSS layout question

    Hi!
    I have finally ditched tables and I'm now doing my first div-based css layout. At times I still feel totally lost like in this example. I can't seem to get the page subtitle ("Etusivu") to move down from the top of the div it is in. I tried different kinds of paddings and margins but either Firefox or IE always screws it up, even if I get it to work in the other browser. If anyone can take a look, I appreciate it a lot!
    Here's my markup:
    <!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>Untitled Document</title>
    <link href="styles.css" rel="stylesheet" type="text/css" />
    <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>
    <style type="text/css">
    <!--
    .otsikko {
        font-family: "Courier New", Courier, monospace;
        font-size: 18px;
        color: #FFFFFF;
        font-weight: bold;
        text-align: center;
    .leipateksti {font-family: "Courier New", Courier, monospace}
    .style1 {font-family: "Courier New", Courier, monospace; color: #FFFFFF; }
    -->
    </style>
    </head>
    <body onload="MM_preloadImages('images/doktor_streetwear_otsikko_ro.gif','images/etusivu_ro.gif ','images/tuotteet_ro.gif','images/tietoa_ro.gif','images/ehdot_ro.gif','images/palaute_ro .gif','images/linkit_ro.gif')">
    <div id="wrapperi">
      <div id="logo"><img src="images/kannulogo.jpg" alt="logo" /></div>
      <div id="otsikko"><a href="index.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('otsikko','','images/doktor_streetwear_otsikko_ro.gif',1)"><img src="images/doktorwear_otsikko.jpg" alt="otsikko" name="otsikko" width="487" height="87" border="0" id="otsikko2" /></a></div>
      <div id="kielet">
        <div id="kielet_pusher"> </div>
        <div class="kieli">SUOMEKSI </div>
        <div class="kieli">IN ENGLISH </div>
      </div>
    <div id="navi"> <a href="index.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('etusivu','','images/etusivu_ro.gif',1)"><img src="images/etusivu.jpg" alt="etusivu" name="etusivu" width="130" height="56" border="0" id="etusivu" /></a><a href="tuotteet.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('tuotteet','','images/tuotteet_ro.gif',1)"><img src="images/tuotteet.jpg" alt="tuotteet" name="tuotteet" width="130" height="55" border="0" id="tuotteet" /></a>
      <a href="tietoa.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('tietoa','','images/tietoa_ro.gif',1)"><img src="images/tietoa.jpg" alt="tietoa" name="tietoa" width="130" height="55" border="0" id="tietoa" /></a>
      <a href="ehdot.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('ehdot','','images/ehdot_ro.gif',1)"><img src="images/ehdot.jpg" alt="ehdot" name="ehdot" width="130" height="55" border="0" id="ehdot" /></a>
      <a href="palaute.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('palaute','','images/palaute_ro.gif',1)"><img src="images/palaute.jpg" alt="palaute" name="palaute" width="130" height="55" border="0" id="palaute" /></a> 
      <a href="linkit.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('linkit','','images/linkit_ro.gif',1)"><img src="images/linkit.jpg" alt="linkit" name="linkit" width="130" height="55" border="0" id="linkit" /></a>  </div>
      <div id="vasen_palkki">Content for  id "vasen_palkki" Goes Here</div>
    <div id="main_content">
    <div class="otsikko" id="tekstiotsikko">ETUSIVU</div>
      <div class="style1" id="iso_alue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nec risus at lorem posuere pellentesque. Sed a tellus lorem. Nullam justo mauris, ultrices sed interdum in, egestas eu leo. Duis interdum elementum gravida. Curabitur eu rutrum nibh. Maecenas molestie turpis ac leo tristique nec pellentesque felis mattis. Etiam placerat laoreet tortor, ac dignissim magna tempor ac. Mauris iaculis vestibulum pellentesque. Proin eu scelerisque ipsum. Sed tincidunt nibh sed ipsum pulvinar iaculis. Cras egestas imperdiet mi. Suspendisse tempus, tortor eget vehicula sagittis, diam massa lobortis odio, vel dictum risus nulla vitae mauris. Praesent tellus erat, pharetra eu fermentum vitae, sodales eu sapien. Aenean odio lectus, mattis in egestas id, auctor at nisl. Donec viverra pharetra auctor. Fusce lectus neque, ullamcorper a ultricies at, auctor at mauris. Proin semper orci quis risus dignissim non cursus tellus lobortis. In hac habitasse platea dictumst. </div>
    </div> 
    </div>
    </body>
    </html>
    And here's the stylesheet:
    @charset "utf-8";
    body {
        background-color: #330000;
    #wrapperi {
        margin: auto;
        padding: 0px;
        width: 800px;
    #logo {
        float: left;
        border: 1px solid #800000;
    #otsikko {
        float: left;
        border: 1px solid #800000;
    #kielet {
        float: right;
        border: 1px solid #800000;
        height: 87px;
        width: 130px;
    .kieli {
        font-family: "Courier New", Courier, monospace;
        font-size: 18px;
        color: #FFFFFF;
        font-weight: bold;
        border-top-width: 1px;
        border-right-width: 0px;
        border-bottom-width: 0px;
        border-left-width: 1px;
        border-top-style: solid;
        border-right-style: solid;
        border-bottom-style: solid;
        border-left-style: solid;
        border-top-color: #800000;
        border-right-color: #800000;
        border-bottom-color: #800000;
        border-left-color: #800000;
        padding: 5px;
    #kielet_pusher {
        height: 25px;
    #navi {
        border: 0px none #800000;
        float: left;
        width: 130px;
    #navi img {
        padding-top: 4px;
        border-top-width: 0px;
        border-right-width: 1px;
        border-bottom-width: 1px;
        border-left-width: 1px;
        border-top-style: solid;
        border-right-style: solid;
        border-bottom-style: solid;
        border-left-style: solid;
        border-top-color: #800000;
        border-right-color: #800000;
        border-bottom-color: #800000;
        border-left-color: #800000;
        padding-bottom: 4px;
    #main_content {
    #otsikko {
    #tekstiotsikko {
        margin-top: 30px;
        margin-bottom: 30px;
    #iso_alue {
        font-size: 14px;
        text-align: left;
        margin-left: 160px;
        margin-right: 200px;
    #vasen_palkki {
        float: right;
        height: 400px;
        width: 130px;
        border: 1px solid #800000;
    #main_content {

    Hi
    As I am getting different layout (depending on browser), and you are missing much of the  text mark-up (h1, h2, h3, p, etc.), which also changes the display, try replacing your section of the code with the one below, and let me know if this is somewhere near what you wish..
    <div id="tekstiotsikko"><h2></h2></div>
      <div id="iso_alue"><h2>ETUSIVU</h2><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nec risus at lorem posuere pellentesque. Sed a tellus lorem. Nullam justo mauris, ultrices sed interdum in, egestas eu leo. Duis interdum elementum gravida. Curabitur eu rutrum nibh. Maecenas molestie turpis ac leo tristique nec pellentesque felis mattis. Etiam placerat laoreet tortor, ac dignissim magna tempor ac. Mauris iaculis vestibulum pellentesque. Proin eu scelerisque ipsum. Sed tincidunt nibh sed ipsum pulvinar iaculis. Cras egestas imperdiet mi. Suspendisse tempus, tortor eget vehicula sagittis, diam massa lobortis odio, vel dictum risus nulla vitae mauris. Praesent tellus erat, pharetra eu fermentum vitae, sodales eu sapien. Aenean odio lectus, mattis in egestas id, auctor at nisl. Donec viverra pharetra auctor. Fusce lectus neque, ullamcorper a ultricies at, auctor at mauris. Proin semper orci quis risus dignissim non cursus tellus lobortis. In hac habitasse platea dictumst.</p> </div>
    PZ

  • Mapviewer legend and note overlap

    I am using Mapviewer 11ea and wish to place a legend above a note in the SOUTH EAST corner of my map. The note is defined in the config file and the legend is provided in the map request. The legend itself seems to create a box larger than required and overlaps the note text below. See the image at http://www.geocities.com/ozspatial/legend-note-overlap.jpg showing the overlap and the large amount of white space at the bottom of the legend.
    The legend component of the request is from the default mapviewer request and looks like:
    <legend bgstyle="fill:#ffffff;stroke:#ff0000" profile="MEDIUM" position="SOUTH_EAST">
              <column>
                <entry text="Map Legend" is_title="true" />
                <entry style="M.STAR" text="center point" />
                <entry style="M.CITY HALL 3" text="cities" />
                <entry style="M.CITY HALL 4" text="big cities" />
                <entry is_separator="true" />
                <entry style="C.ROSY BROWN STROKE" text="state boundary" />
                <entry style="L.PH" text="interstate highway" />
                <entry text="County population:" />
                <entry style="V.COUNTY_POP_DENSITY" tab="1" />
              </column>
      </legend>Does anyone know how to reduce the white space in the legend or some other way to avoid the overlap? (whilst still placing both note and legend in the SOUTH EAST corner)
    thanks,
    Ross.

    Hi Ross,
    I don't think you will be able to reduce the white space at the bottom, but there are some parameters on the legend that you can use.
    1) In overlap situations you can set the transparency of the legend:
    <legend bgstyle="fill:#ffffff;fill-opacity:128;stroke:#ff0000" profile="MEDIUM" position="SOUTH_EAST">
    2) For the profile value there is an internal size defined. In your figure I can note that the advanced style items are also overlapping, which means that the internal size MEDIUM seems not appropriate for this legend. You can assign a height for a legend entry:
    <entry style="V.CA INCOME 2" tab="1" height="150"/>
    3) With version 11 there are two new parameters (location_x and location_y) for the legend that can be used to put the legend in any position. In this case the position attribute is ignored if defined.
    <legend bgstyle="fill:#ffffff;fill-opacity:128;stroke:#ff0000" profile="MEDIUM" location_x="20" location_y="50">
    Joao

  • HT4245 Why am I able to send an IMessage to one IPhone and not to another phone that is also an IPhone..It just sends as regular text to the second one.

    I am having a problem with Imessaging. I have two people who also have IPhones, I am able to send one an IMessage and not the other. Can anyone explain how this could happen & how to fix it? Thanks

    The other iPhone may not have iMessage turned on, or the iPhone may not have wi-fi access or cellular data turned on at the time.

  • What would cause an IMAC to recognize one printer on a wireless network and not recognize another printer?

    What would cause an IMAC to recognize one printer on a wireless network and not another printer?  I have a smaller HP and a an HP 4600.  The computer recognizes the smaller printer but not the bigger printer even though the printer in Settings and shows up on Settings, but I cannot print to it. 

    Do you have a printer driver installed for it? When you open the Print dialog have you selected it from the Printer dropdown menu at the top of the dialog?
    Do you know that the printer is working and is properly installed (Added?)

  • CSS layout question regarding browser sizing

    Hi,
    Basically I want the basis of my site to be - A header, Main content with a background image, A Footer.
    I'm having problems however, I can't seem to get my footer to position where I want it i.e. at the bottom of the browser window at all times. I'm doing it as an AP div and how it should work is that it's fixed at the bottom of the page and then if the user resizes their browser in the y direction the footer moves up with it, over the top of the main content (but not the header which will have a higher z-index).
    The way I THOUGHT to do it was to firstly create a div tag for the whole page (780 pixels wide, auto left and right margins, auto height) and then inside that put my ap div header fixed height at the top and have another ap div as the footer, fixed height and tell it to position 0 pixels from the bottom. However this doesn't seem to do the trick, I'm sure I'm missing something really really simple. Anyone who's vaguely familiar with the program will be able to answer this I'm sure. If my question isn't clear please let me know and I'll rephrase,
    Ta

    There is no reason to use APDivs for such a simple layout.  Default CSS positioning (which is no positioning at all) is typically all you need for most layouts.  Build your HTML markup logically from top to bottom of page and your footer will naturally appear at page bottom.
    Live Demo (view page source to see the code)
    http://alt-web.com/TEMPLATES/Basic-1-col-fixed.html
    Or, for a Sticky Footer using Fixed positioning:
    http://alt-web.com/DEMOS/CSS2-Sticky-Footer.shtml
    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics | Print | Media  Specialists
    http://alt-web.com/
    http://twitter.com/altweb
    http://alt-web.blogspot.com

  • CSS layout question - height of outer DIV

    Hopefully this is a quick one - In the past I've used CSS for the main layout of a page, but still used tables within a DIV. But I'm trying to be good and used DIVs there too.
    Anyway - I have a basic example here:
    http://www.learners-guide.co.uk/lessons/cockpit-drill/layout.php
    With the row in the main content split into two columns, using:
    #outerWrapper #contentWrapper #content #row_one {
              width:580px;
              border:2px solid #333;
              background-color:#99FF99;
              padding:10px;
    #outerWrapper #contentWrapper #content #row_one #row_one_left {
                width: 288px;
              height:auto;
              padding:0px;
              float:left;
              margin: 0 0 0 0; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
    #outerWrapper #contentWrapper #content #row_one #row_one_right {
                width: 288px;
              height:auto;
              padding:0px;
              float:right;
              margin: 0 0 0 0; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
    The problem is that the #row_one_left and #row_one_right colums spill out of the containing #row_one DIV.
    How would I make the containing DIV expand to contain the columns? I can do it by specifying a height of the #row_one DIV, but assume this is bad form, and would produce varying results depending on screen / resolution / browser etc.
    I thought maybe using height: auto; but no joy with that either.
    I'm assuming it must be possible, as it seems a fairly basic layout requiement.
    Thanks.

    You have to use some style that forces that div to clear the floats (since floated elements are removed from the flow, containing elements act as if they aren't even there).  To do that, something like "overflow:hidden" works wonderfully well.  So remove the height:auto styles (which is the default anyhow), and change this -
    #outerWrapper #contentWrapper #content #row_one {
              width:580px;
              border:2px solid #333;
              background-color:#99FF99;
              padding:10px;
    to this -
    #outerWrapper #contentWrapper #content #row_one {
              width:580px;
              border:2px solid #333;
              background-color:#99FF99;
              padding:10px;
              overflow:hidden;

  • CSS Layout Questions

    Only making baby steps in CSS still but I am learning a lot. Here's a link to the page I am trying to create: http://www3.telus.net/~jessum/details_layout.html
    Here's what I have managed to create so far: http://www3.telus.net/~jessum/details.html
    When explaining any steps please explain it using Dreamweaver. I will be looking in the code to see how it all works but I want to be able to get proficient using Dreamweaver so I can see how things flow etc. before I try and hand code.
    Questions
    1. Is it a good practice to use a "container" to hold all of the div's or is it better to start by adding a header without a container?
    2. How can I centre a div in the page?
    I read that to align the div so it's "centred' in the page I can use: margin: auto;
    but I'm not sure how to do this. Please explain.
    3. How do I remove the space around the "container"? I've set the margin and padding to: "0" but the space is still there.
    Thanks

    osgood_ wrote:
    Not sure where this notion of using the body as a container came from but for years a wrapper or container was considered standard practice.
    The idea is being promoted by several of the most active and knowledgeable members of this forum. I think the idea first came from Altruistic Gramps, and I remember debating the issue with him about a year ago. It has also been picked up enthusiastically by Murray, and I've seen Nancy O suggest the same idea.
    I've been doing a lot of research into CSS3 recently, and discovered that the Borders and Backgrounds module specifically advises against styling the <html> element (http://www.w3.org/TR/css3-background/#special-backgrounds). It doesn't give a reason for this recommendation.
    I suppose the idea of giving the body a width instead of using a container might come from the HTML5 definition of the body as representing the main content of the document (http://dev.w3.org/html5/spec/the-body-element.html#the-body-element).
    I suspect that this is likely to develop into the same type of fruitless argument as we had several years ago about the "superiority" of ems over pixels. Adding a single <div> to act as the container or wrapper for the content doesn't strike me as being less efficient. It also has the advantage of avoiding styling the <html> element.

  • CSS Layout Questions [locked]

    Here's a link to the page I am trying to create: http://www3.telus.net/~jessum/details_layout.html
    Here's what I have managed to create so far: http://www3.telus.net/~jessum/details.html
    When explaining any steps please explain it using Dreamweaver. I will be looking in the code to see how it all works but I want to be able to get proficient using Dreamweaver so I can see how things flow etc. before I try and hand code.
    Questions
    1. Is it a good practice to use a "container" to hold all of the div's or is it better to start by adding a header without a container?
    2. How can I centre a div in the page?
    I read that to align the div so it's "centred' in the page I can use: margin: auto;
    but I'm not sure how to do this. Please explain.
    3. How do I remove the space around the "container"? I've set the margin and padding to: "0" but the space is still there.
    Thanks

    Murray *ACP* wrote:
    You already have a "container" - the body tag.  You can center the page by giving the body an explicit width and then left/right margins of auto, e.g.,
    body {
         width:960px;
         margin:0 auto;
    The idea of using the body to centre the page seems to have become fashionable of late. The problem with doing so is that it leaves an unstyled area on the body's background extends into the left and right margins when displayed on a screen that is wider than the body. So, followers of this fashion then style the <html> element.
    The CSS3 Borders and Backgrounds module specifically advises against styling the <html> element. See http://www.w3.org/TR/css3-background/#special-backgrounds.
    Message was edited by: David_Powers to correct description of what happens in the margins.

  • Quick CSS layout question

    This should be a quick one - I have just added in some links to the other countries on the page below. Basically all the links under the main Botswana image on the left hand side.
    Trouble is, that they have knocked the second row of lodges down to their right (this is how they should appear: http://www.goodsafariguide.com/botswana/index.php)
    I thought the culprit might be a clear:both; in the #outerWrapper #contentWrapper #content #row_two rule in the botswana_layout.css file, but apparently not.
    If anyone could quickly spot how to fix this that would be great.
    The page is here:
    http://www.goodsafariguide.com/botswana/botswana.php
    Thank you!

    Good news with the solution!
    Iain71 wrote:
    So its all looking as it should now:
    http://www.goodsafariguide.com/botswana/botswana3.php
    Its interesting that you mention the <a href="someurl.php"><div>Some content</div></a> thing. Although it seems to work, it wa something I wasn't entirely convinced was technically correct. I'm not sure how else you would do that though, and it seems a fairly common thing on sites (if not achieved the same way), ie having a large area that acts as a link. Maybe it should be contained in an outer DIV.
    Thanks again for your help.
    As I understand it, strictly speaking a <div> cannot be a link so, it should not be wrapped in an anchor tag.  I think it has something to do with the fact that a <div> is a block level element and <a> is in line.  This link http://htmlhelp.com/reference/wilbur/special/a.html is a reference for <a> it lists what other elements it can occur in and what it can contain.  An <a> can be placed inside a <div> but not the other way around.  Having said that, your use of the two elements kind of proves that they work but then you can fix wood together with nails and screws but some situations call for one or the other!  Reading up on this, I learn that it's different now in HTML5 but then I imagine, that was done to confuse me!
    The way I work out a page these days is based on my simple understanding of semantic code which for me means that the best element to use will always be the one that was intended for that job.  The most obvious are <ul> and <li> for lists and <p> for a paragraph.  I suppose <head> and <body> give even stronger clues.  I also understand that search engines and in particular, Google, appreciate the proper use of these elements when pages are crawled.  I know that SEO is a dark art but it kind of makes sense that a stupid robot will understand only the information is sees.  It knows a list is a list but it doesn't know that a div is a list.
    I have had a go at building your box of images using Dreamweaver Javascript rollover and the list elements.  It's quick and dirty and the javascript makes it look more complicated than it is.  However, if you compare my code with yours, I think that you will agree that my alternative is more straight forward and easier to read.
    One other thing about this idea is that but putting your image in the page, you can get a bit more content in there with your alt="" and title"" attributes.  At the moment, your option is a string of content-less divs.
    martcol.co.uk/test/africa.html
    Regards
    Martin
    You have to bear in mind that I am a serious hobbyist web developer who trys his hardest understand this shizzle.

  • Using Photoshop scripting copy a layer and paste into another document at a particular selection

    I want to copy a layer of a document and paste it into another document in the particular layer selection..

    Thanks Badunit for your quick response
    I have found the answer - it is a incompatabilty between CopyPaste Pro and Numbers: -
    Thanks dbg1596 - solved my problem with which I wasted a good couple of hours getting more and more frustrated with numbers 3.0
    I had the same problem - copy a cell - paste into another cell and it created three vertical cells with the pasted data in the middle
    Definitely a problem between CopyPaste Pro - one of the most useful aps on my Mac for the last many years
    Once I quit CopyPaste Pro - no problem with pasting in Numbers 3.0
    But I use CopyPaste Pro all the time
    Have the folks responded to your query?
    But I use CopyPaste Pro all the time - hope that it can be sorted sooner rather than later

  • Triggering audio to stop and not overlap on assessment slides / Layers in Captivate

    I am struggling with audio overlapping on assessment questions if learner clicks early and answers the question. The slide audio continues and the answer audio plays also.
    Is there a way to stop slide audio when user clicks another button with audio?
    Also, is there a way to set up layers in Captivate like you can in Storyline?
    Any help would be much appreciated and time saving.

    If you want layers like in SL, you'll have to stay with SL. If you want libraries, you have to stay with Captivate. Just kidding.
    Control over slide audio is very limited, you cannot stop it when another audio clip starts playing. That is only possible with object audio and with audio clips that are played with the commands Play Audio.
    Audio Objects: Control them! - Captivate blog

  • Why are you not working? I can't figure out why this works in 1 doc, and not in another

    I'm trying to take info from a cell on 1 spreadsheet and have it populate into a different one (pending if checkbox is true or not). I've been able to do it with 2 files but for some reason this one isn't doing what I need. If the checkbox is unchecked the text should stay in the new spreadsheet cell, if it's checked I want the row removed, but for reason instead of removing the row it just places a 0 in the cell.
    This is what I want:
    Like I said it works great on the other doc, just not on this new one. (the 2 docs vary with some of the text, but in the second image I've "checkboxed" out some of the text)
    Please help!
    Thanks!
    Nikki

    You may have the wrong cell reference  (B2) in the second part of your formula. If B2 is empty, the result will be displayed as a 0. Did you mean to have A2 in both parts of the formula?
    SG

Maybe you are looking for