Script-generated code displaying differntly than the exact same code displayed staticly... help!?!?!

Discussion in 'Javascript' started by Akbar, Sep 7, 2003.

  1. Akbar

    Akbar Guest

    Hey there,

    Big-time curiosity issue here...

    Here's the test code (it's not that long)... it's to display a large
    number of image links with captions, ideally pulled in from an
    external file (that part's not here -- spotlighting the problem code):

    --------BEGIN CODE PAGE------------
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/tr/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <title>Test</title>
    <script type="text/javascript">
    function testSpans(sbody) {
    var sp, i, j, oneRecord;
    sbody = document.getElementById(sbody);
    for (i = 0; i <= 1; i++) {
    var bkSpan, bkAa, bkAb, bkAex, bkImg, bkTitle,
    bkTypea, bkTypeb, txt, br;
    txt = "Text Text";
    testImg = document.createElement("img");
    testImg.setAttribute("src",
    "images/test.gif");
    testA = document.createElement("a");
    testA.setAttribute("href",
    "test/url/index.htm");
    testA.appendChild(testImg);
    br = document.createElement("br");
    testA.appendChild(br);
    testText = document.createTextNode(txt);
    testA.appendChild(testText);
    testSpan = document.createElement("span");
    testSpan.setAttribute("id", i);
    testSpan.style.display = "inline";
    testSpan.style.width = "100px";
    testSpan.appendChild(testA);
    sbody.appendChild(testSpan);
    }
    }


    function init() {
    testSpans('scoobyDoo');
    }
    </script>
    </head>
    <body onload="init()">
    <h1>Test</h1>
    <hr />
    <table><tr><td id="scoobyDoo"></td></tr></table>
    </body>
    </html>
    --------END CODE PAGE------------

    When it displays, the <span>'s don't line up on the same line like
    they should:

    IMAGE IMAGE
    text text

    Instead, it's as if the first span never ends... the image from the
    second span displays right after the text in the first, like this:

    IMAGE
    text IMAGE
    text

    Using MSIE's "View Partial Source" powertoy, I can see that the
    generated HTML is as follows:

    --------BEGIN GENERATED HTML------------
    <H1>Test</H1>
    <HR>

    <TABLE>
    <TBODY>
    <TR>
    <TD id=scoobyDoo><SPAN id=0 style="DISPLAY: inline; WIDTH: 100px"><A
    href="test/url/index.htm"><IMG height=30 src="images/test.gif"
    width=28><BR>Text
    Text</A></SPAN><SPAN id=1 style="DISPLAY: inline; WIDTH: 100px"><A
    href="test/url/index.htm"><IMG height=30 src="images/test.gif"
    width=28><BR>Text
    Text</A></SPAN></TD></TR></TBODY></TABLE>
    --------END GENERATED HTML------------

    The problem is that *this is right!* Putting this code in a page
    displays perfectly, but it doesn't when generated by the JavaScript
    shown above.

    Anyone have any ideas? A CSS tag that will help? Another way to
    dynamically create this data? Anything will be appreciated...

    - Akbar
     
    Akbar, Sep 7, 2003
    #1
    1. Advertising

  2. Akbar

    DU Guest

    Re: Script-generated code displaying differntly than the exact samecode displayed staticly... help!?!?!

    Akbar wrote:
    > Hey there,
    >
    > Big-time curiosity issue here...
    >
    > Here's the test code (it's not that long)... it's to display a large
    > number of image links with captions, ideally pulled in from an
    > external file (that part's not here -- spotlighting the problem code):
    >
    > --------BEGIN CODE PAGE------------
    > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    > "http://www.w3.org/tr/xhtml1/DTD/xhtml1-transitional.dtd">
    > <html>
    > <head>


    I usually add these lines into xhtml files:
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <meta http-equiv="Content-Language" content="en-us" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <meta http-equiv="Content-Script-Type" content="text/javascript" />


    > <title>Test</title>
    > <script type="text/javascript">
    > function testSpans(sbody) {




    "In XHTML, the script and style elements are declared as having #PCDATA
    content. As a result, < and & will be treated as the start of markup,
    and entities such as &lt; and &amp; will be recognized as entity
    references by the XML processor to < and & respectively. Wrapping the
    content of the script or style element within a CDATA marked section
    avoids the expansion of these entities."
    http://www.w3.org/TR/2002/REC-xhtml1-20020801/#h-4.8

    So, if you use < or & in your unmarked CDATA function, then it will be
    treated and considered as markup.

    <script type="text/javascript">
    <![CDATA[
    .... unescaped script content ...
    ]]>
    </script>

    is what I suggest here since you use < in your code.

    > var sp, i, j, oneRecord;
    > sbody = document.getElementById(sbody);
    > for (i = 0; i <= 1; i++) {


    right here, we see the <.

    > var bkSpan, bkAa, bkAb, bkAex, bkImg, bkTitle,
    > bkTypea, bkTypeb, txt, br;
    > txt = "Text Text";
    > testImg = document.createElement("img");
    > testImg.setAttribute("src",
    > "images/test.gif");


    Not recommendable. setAttribute should be used only when there is no
    other attribute possible. Here, the simple

    testImg.src = "images/test.gif";

    works.

    http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-87762984

    > testA = document.createElement("a");
    > testA.setAttribute("href",
    > "test/url/index.htm");


    testA.href = "test/url/index.htm";
    http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-88517319

    > testA.appendChild(testImg);
    > br = document.createElement("br");
    > testA.appendChild(br);
    > testText = document.createTextNode(txt);
    > testA.appendChild(testText);


    or
    testA.appendChild(document.createTextNode(txt));


    > testSpan = document.createElement("span");
    > testSpan.setAttribute("id", i);


    testSpan.id = i;
    http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-63534901

    > testSpan.style.display = "inline";


    Per definiion, a span is an inline element. So, there is no need for
    that here.

    > testSpan.style.width = "100px";
    > testSpan.appendChild(testA);
    > sbody.appendChild(testSpan);
    > }
    > }
    >
    >
    > function init() {
    > testSpans('scoobyDoo');
    > }
    > </script>
    > </head>
    > <body onload="init()">
    > <h1>Test</h1>
    > <hr />
    > <table><tr><td id="scoobyDoo"></td></tr></table>
    > </body>
    > </html>
    > --------END CODE PAGE------------
    >
    > When it displays, the <span>'s don't line up on the same line like
    > they should:
    >
    > IMAGE IMAGE
    > text text
    >
    > Instead, it's as if the first span never ends... the image from the
    > second span displays right after the text in the first, like this:
    >
    > IMAGE
    > text IMAGE
    > text
    >
    > Using MSIE's "View Partial Source" powertoy, I can see that the
    > generated HTML is as follows:
    >
    > --------BEGIN GENERATED HTML------------
    > <H1>Test</H1>
    > <HR>
    >
    > <TABLE>
    > <TBODY>
    > <TR>
    > <TD id=scoobyDoo><SPAN id=0 style="DISPLAY: inline; WIDTH: 100px"><A
    > href="test/url/index.htm"><IMG height=30 src="images/test.gif"
    > width=28><BR>Text
    > Text</A></SPAN><SPAN id=1 style="DISPLAY: inline; WIDTH: 100px"><A
    > href="test/url/index.htm"><IMG height=30 src="images/test.gif"
    > width=28><BR>Text
    > Text</A></SPAN></TD></TR></TBODY></TABLE>
    > --------END GENERATED HTML------------
    >
    > The problem is that *this is right!* Putting this code in a page
    > displays perfectly, but it doesn't when generated by the JavaScript
    > shown above.
    >
    > Anyone have any ideas? A CSS tag that will help? Another way to
    > dynamically create this data? Anything will be appreciated...
    >
    > - Akbar
    >


    2 other suggestions:
    - write a short but meaningful subject line in your post. Just
    "Script-generated code displaying differntly" was sufficient
    - try to upload your code, page somewhere and then just give the url;
    that's always better and so much more convenient as the code can be
    tested with various softwares (validations, verifying http headers, link
    validators, accessibility validators,etc..)

    DU
    --
    Javascript and Browser bugs:
    http://www10.brinkster.com/doctorunclear/
    - Resources, help and tips for Netscape 7.x users and Composer
    - Interactive demos on Popup windows, music (audio/midi) in Netscape 7.x
    http://www10.brinkster.com/doctorunclear/Netscape7/Netscape7Section.html
     
    DU, Sep 7, 2003
    #2
    1. Advertising

  3. Akbar <> writes:

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


    I see you use a DOCTYPE that puts IE in standards mode.


    > When it displays, the <span>'s don't line up on the same line like
    > they should:
    >
    > IMAGE IMAGE
    > text text


    They shouldn't with the code you generate, not in standards mode.

    > <SPAN id=0 style="DISPLAY: inline; WIDTH: 100px">


    I see a problem right here. The CSS width property should have no
    effect on an inline block.

    > The problem is that *this is right!* Putting this code in a page
    > displays perfectly,


    If by "this code" you mean the above, then notice that you don't have
    a DOCTYPE that puts the browser into standards mode. Add that, and IE
    will show it the same way as when generating it with Javascript.

    > Anyone have any ideas? A CSS tag that will help? Another way to
    > dynamically create this data? Anything will be appreciated...


    Make the blocks display:block and float:left. Then they will line up
    the way you want. Or put them into separate td's.

    /L
    --
    Lasse Reichstein Nielsen -
    Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
    'Faith without judgement merely degrades the spirit divine.'
     
    Lasse Reichstein Nielsen, Sep 7, 2003
    #3
  4. Akbar

    Akbar Guest

    Re: Script-generated code displaying differntly

    DU,

    Lots of great info! Thanks! Some issues tho...

    On Sun, 07 Sep 2003 15:11:56 -0400, DU <>
    wrote:

    >So, if you use < or & in your unmarked CDATA function, then it will be
    >treated and considered as markup.
    >
    ><script type="text/javascript">
    ><![CDATA[
    >... unescaped script content ...
    >]]>
    ></script>
    >
    >is what I suggest here since you use < in your code.
    >
    >> var sp, i, j, oneRecord;
    >> sbody = document.getElementById(sbody);
    >> for (i = 0; i <= 1; i++) {

    >
    >right here, we see the <.


    Tried this, now IE throws Syntax Errors. :( (In Opera7, it doesn;t
    do anything at all... hmmmm. Neither does another page that works
    fine.. hmmmmmmm.)

    >> testImg.setAttribute("src", "images/test.gif");

    >
    >Not recommendable. setAttribute should be used only when there is no
    >other attribute possible. Here, the simple
    >
    > testImg.src = "images/test.gif";
    >
    >works.


    Thanks! Me == newb. Got most of this from an O'Reilly cookbook.
    Learning by example...

    >> testSpan.style.display = "inline";

    >
    >Per definiion, a span is an inline element. So, there is no need for
    >that here.


    This was me trying just about anything to see what might work to fix
    it...

    >2 other suggestions:
    >- write a short but meaningful subject line in your post. Just
    >"Script-generated code displaying differntly" was sufficient


    'kay.

    >- try to upload your code, page somewhere and then just give the url;
    >that's always better and so much more convenient as the code can be
    >tested with various softwares (validations, verifying http headers, link
    >validators, accessibility validators,etc..)


    'kay

    Thanks again!

    - Akbar
     
    Akbar, Sep 10, 2003
    #4
  5. Akbar

    Akbar Guest

    On 07 Sep 2003 21:12:04 +0200, Lasse Reichstein Nielsen
    <> wrote:

    >Akbar <> writes:
    >
    >> --------BEGIN CODE PAGE------------
    >> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    >> "http://www.w3.org/tr/xhtml1/DTD/xhtml1-transitional.dtd">

    >
    >I see you use a DOCTYPE that puts IE in standards mode.


    Actaully, I'm just using the HomeSite default new-page template. :)

    >> When it displays, the <span>'s don't line up on the same line like
    >> they should:
    >>
    >> IMAGE IMAGE
    >> text text

    >
    >They shouldn't with the code you generate, not in standards mode.


    Hm. They do when the code is input static-ly versus dynamically. Go
    figure...

    >> <SPAN id=0 style="DISPLAY: inline; WIDTH: 100px">

    >
    >I see a problem right here. The CSS width property should have no
    >effect on an inline block.


    Without the WIDTH property, the text below the image wouldn't wrap to
    stay below the image.

    >> The problem is that *this is right!* Putting this code in a page
    >> displays perfectly,

    >
    >If by "this code" you mean the above, then notice that you don't have
    >a DOCTYPE that puts the browser into standards mode.


    But the first this you said above was that I "use a DOCTYPE that puts
    IE in standards mode." Now you say I "*don't* have a DOCTYPE that puts
    the browser into standards mode." (Emphasis mine) Which is it? :(

    >Add that, and IE
    >will show it the same way as when generating it with Javascript.


    What DOCTYPE would you recommend?

    >Make the blocks display:block and float:left. Then they will line up
    >the way you want. Or put them into separate td's.


    Nope. Tried this and they all displayed in a vert line down the left
    side. Wanted them to appear like words on a page, each span walking
    from left to right across the page then wrapping at the edge of the
    page.

    Thanks for you comments!

    - Akbar
     
    Akbar, Sep 10, 2003
    #5
  6. Akbar <> writes:

    > >> <SPAN id=0 style="DISPLAY: inline; WIDTH: 100px">

    > >
    > >I see a problem right here. The CSS width property should have no
    > >effect on an inline block.

    >
    > Without the WIDTH property, the text below the image wouldn't wrap to
    > stay below the image.


    With a width property, in standards mode, it won't either, since the
    width property of inline elements are ignored.

    > >> The problem is that *this is right!* Putting this code in a page
    > >> displays perfectly,

    > >
    > >If by "this code" you mean the above, then notice that you don't have
    > >a DOCTYPE that puts the browser into standards mode.

    >
    > But the first this you said above was that I "use a DOCTYPE that puts
    > IE in standards mode." Now you say I "*don't* have a DOCTYPE that puts
    > the browser into standards mode." (Emphasis mine) Which is it? :(


    Do you put the code into the same page, or into a page of its own?

    If I take the generated code that you showed, and put it into a page
    of its own, then it displays the way you want. Because the generated
    code doesn't have a DOCTYPE, *taht* page is displayed in quirks mode.

    If I then copy the DOCTYPE from the original page and add it to the
    top of the generated code, then the generated code is shown according
    to standards. And it displays the way you don't want it to, but that
    the standards mandate.

    > What DOCTYPE would you recommend?


    Any will do, as long as the HTML/XHTML actually follows the DOCTYPE.
    To enforce standards mode, you will have to pick a DOCTYPE that triggers
    standards mode. I prefer HTML 4.01 (strict) or XHTML 1.1, but it's not
    that important, as long as you add a correct URL.

    The generated code has tag names in capital letters, so it's not XHTML.
    Then I would use:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/REC-html401/strict.dtd">

    This page shows the DOCTYPE effects in Opera, which is similar to IE and
    Mozilla: <URL:http://www.opera.com/docs/specs/doctype/>

    [float:left]
    > Nope. Tried this and they all displayed in a vert line down the left
    > side. Wanted them to appear like words on a page, each span walking
    > from left to right across the page then wrapping at the edge of the
    > page.


    That is probably becaue you have wrapped it in a table. A table with one
    cell is rarely necessary.

    Try looking at this page:
    ---
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/REC-html401/strict.dtd">
    <HTML>
    <HEAD><TITLE>Test page</TITLE></HEAD>
    <BODY>
    <DIV style="border:1px solid green;width:350px;height:300px;">
    <DIV style="width:100px;float:left;">
    <A HREF=""><IMG SRC="http://www.infimum.dk/privat/PicA.png"><BR>
    Some Text</A></DIV>
    <DIV style="width:100px;float:left;">
    <A HREF=""><IMG SRC="http://www.infimum.dk/privat/PicB.png"><BR>
    Some more text</A></DIV>
    <DIV style="width:100px;float:left;">
    <A HREF=""><IMG SRC="http://www.infimum.dk/privat/PicA.png"><BR>
    small text</A></DIV>
    <DIV style="width:100px;float:left;">
    <A HREF=""><IMG SRC="http://www.infimum.dk/privat/PicB.png"><BR>
    Text that goes on for miles and miles</A></DIV>
    </DIV>
    </BODY>
    </HTML>
    ---
    The divs (no need to use spans, floats are automatically made block
    elements) line up fine, and wrap to the next line when there isn't room
    enough.

    /L
    --
    Lasse Reichstein Nielsen -
    Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
    'Faith without judgement merely degrades the spirit divine.'
     
    Lasse Reichstein Nielsen, Sep 10, 2003
    #6
  7. Akbar

    Akbar Guest

    Replace the first DIVs text wth the fourth's and this code breaks. See
    here -> http://www.straffin.com/test/divtest.html

    Thank you for your help... I really want to do this right (so it
    *works* and is *standard*), but I'm just not seeing how...

    - Akbar

    On 10 Sep 2003 11:25:50 +0200, Lasse Reichstein Nielsen
    <> wrote:

    > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    > "http://www.w3.org/TR/REC-html401/strict.dtd">
    > <HTML>
    > <HEAD><TITLE>Test page</TITLE></HEAD>
    > <BODY>
    > <DIV style="border:1px solid green;width:350px;height:300px;">
    > <DIV style="width:100px;float:left;">
    > <A HREF=""><IMG SRC="http://www.infimum.dk/privat/PicA.png"><BR>
    > Some Text</A></DIV>
    > <DIV style="width:100px;float:left;">
    > <A HREF=""><IMG SRC="http://www.infimum.dk/privat/PicB.png"><BR>
    > Some more text</A></DIV>
    > <DIV style="width:100px;float:left;">
    > <A HREF=""><IMG SRC="http://www.infimum.dk/privat/PicA.png"><BR>
    > small text</A></DIV>
    > <DIV style="width:100px;float:left;">
    > <A HREF=""><IMG SRC="http://www.infimum.dk/privat/PicB.png"><BR>
    > Text that goes on for miles and miles</A></DIV>
    > </DIV>
    > </BODY>
    > </HTML>
     
    Akbar, Sep 11, 2003
    #7
  8. Akbar <> writes:

    > Replace the first DIVs text wth the fourth's and this code breaks. See
    > here -> http://www.straffin.com/test/divtest.html


    Ah, well noticed. To avoid that, you must make every box the same
    height, by setting the height property of the divs.

    /L
    --
    Lasse Reichstein Nielsen -
    Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
    'Faith without judgement merely degrades the spirit divine.'
     
    Lasse Reichstein Nielsen, Sep 11, 2003
    #8
  9. Akbar

    Akbar Guest

    On 11 Sep 2003 04:36:27 +0200, Lasse Reichstein Nielsen
    <> wrote:

    >Akbar <> writes:
    >
    >> Replace the first DIVs text wth the fourth's and this code breaks. See
    >> here -> http://www.straffin.com/test/divtest.html

    >
    >Ah, well noticed. To avoid that, you must make every box the same
    >height, by setting the height property of the divs.


    And I can do that, but when I put this logic into my JavaScript, it
    does the same thing the SPANs were doing.

    This script --> http://www.straffin.com/test/dynamic.html
    generates this HTML --> http://www.straffin.com/test/static.html
    but they don't work/look the same. :(

    I believe that DU had something whet he mentioned using CDATA, but I
    cannot get that to work at all... it just gives syntax errors. There's
    enough code that I could pull it out into an external file, but am not
    sure how to do so.

    Any pointers on the CDATA or external file stuff? :)

    - Akbar
     
    Akbar, Sep 11, 2003
    #9
  10. Akbar

    DU Guest

    Re: Script-generated code displaying differntly than the exact samecode displayed staticly... help!?!?!

    Akbar wrote:


    >
    > This script --> http://www.straffin.com/test/dynamic.html
    > generates this HTML --> http://www.straffin.com/test/static.html
    > but they don't work/look the same. :(
    >


    You have to first establish what you want here: an HTML 4.01 strict DTD
    or an XHMTL 1 transitional DTD. Because I gave you numerous advices
    based on the DTD you first chose. If you later remove that DTD, then
    such advices if not removed will likely cause validation errors and
    script errors.

    > I believe that DU had something whet he mentioned using CDATA, but I
    > cannot get that to work at all... it just gives syntax errors. There's
    > enough code that I could pull it out into an external file,


    You do not need to create an external file. Creating an external .js
    file (regardless of DTD) is recommendable when the .js file is likely to
    be used again for other files; cached files save http connection trips
    to the server.

    but am not
    > sure how to do so.


    Don't worry, I have done this before and I still have an entire working
    example in a file.

    >
    > Any pointers on the CDATA or external file stuff? :)
    >
    > - Akbar
    >


    This code works in Mozilla 1.5b, NS 7.1, Opera 7.20 and MSIE 6 for
    Windows. I corrected a lot of misses in your code, removed unnecessary
    variables, tuned their declarations and assignments and optimized the
    code at several places. The color borders, commented out, are only there
    for some visual feedback of the layout.
    If you want all your <div>s to be on an horizontal line in MSIE 6 for
    Windows as well, then you'll need to make some changes to the code.
    Creating <div>s and adding a <br> to anchor objects certainly does NOT
    seem to be necessary nor needed: I think it's only there to have the
    text right under the image and links all lined up horizontally.

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

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us">

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <meta http-equiv="Content-Language" content="en-us" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <meta http-equiv="Content-Script-Type" content="text/javascript" />

    <title>Creating dynamically an html file</title>

    <style type="text/css">
    p#validation img {width:88px; height:31px; margin:0 0.5em;}
    </style>

    <script type="text/javascript">
    // <![CDATA[
    function testDivs(sbody)
    {
    for (var iterator = 0; iterator < 7; iterator++)
    {
    var DOMobjImg = document.createElement("img");
    DOMobjImg.src =
    "http://www10.brinkster.com/doctorunclear/GRAPHICS/GIF/Wavey.gif";
    DOMobjImg.width = "25";
    DOMobjImg.height = "29";
    DOMobjImg.alt = ":)";
    // DOMobjImg.alt = "Relevant meaningful alternate text";
    var DOMobjA = document.createElement("a");
    DOMobjA.href = "http://www.yahoo.com/";
    DOMobjA.title = "Yahoo.com";
    DOMobjA.appendChild(DOMobjImg);
    var br = document.createElement("br");
    DOMobjA.appendChild(br);

    DOMobjA.style.margin = "0 6px";
    //DOMobjA.style.border = "1px dashed green";
    DOMobjA.appendChild(document.createTextNode("Anchor" + iterator));
    var DOMobjDiv = document.createElement("div");
    /* DOMobjDiv.id = iterator; Why give such div an id? */
    DOMobjDiv.style.cssFloat = "left";
    DOMobjDiv.style.width = "100px";
    // DOMobjDiv.style.border = "1px dotted red";
    DOMobjDiv.appendChild(DOMobjA);
    document.getElementById(sbody).appendChild(DOMobjDiv);
    };
    var strTest = " < & ";
    }
    // ]]>
    </script>

    </head>
    <body onload="testDivs('scoobyDoo');">
    <h1>Test</h1>
    <hr />
    <table border="2" frame="box" width="724" style="margin:0 auto;"><tr><td
    id="scoobyDoo"></td></tr></table>
    <p id="validation"><a href="http://validator.w3.org/check/referer"><img
    src="http://www.w3.org/Icons/valid-xhtml10.png" title="Verify this
    page's markup syntax" alt="Valid XHTML 1.0!" /></a> <a
    href="http://jigsaw.w3.org/css-validator/check/referer"><img
    src="http://jigsaw.w3.org/css-validator/images/vcss" title="Verify this
    page's CSS code" alt="CSS compliant" /></a></p>

    </body>
    </html>

    DU
    --
    Javascript and Browser bugs:
    http://www10.brinkster.com/doctorunclear/
    - Resources, help and tips for Netscape 7.x users and Composer
    - Interactive demos on Popup windows, music (audio/midi) in Netscape 7.x
    http://www10.brinkster.com/doctorunclear/Netscape7/Netscape7Section.html
     
    DU, Sep 11, 2003
    #10
  11. Akbar

    Akbar Guest

    On Thu, 11 Sep 2003 00:37:06 -0400, DU <>
    wrote:

    >This code works in Mozilla 1.5b, NS 7.1, Opera 7.20 and MSIE 6 for
    >Windows. I corrected a lot of misses in your code, removed unnecessary
    >variables, tuned their declarations and assignments and optimized the
    >code at several places. The color borders, commented out, are only there
    >for some visual feedback of the layout.


    Thanks very much... this is great!

    >If you want all your <div>s to be on an horizontal line in MSIE 6 for
    >Windows as well, then you'll need to make some changes to the code.


    For example? (Whether I like it or not, IE will be the target browser
    and needs to work there above all.)

    >Creating <div>s and adding a <br> to anchor objects certainly does NOT
    >seem to be necessary nor needed: I think it's only there to have the
    >text right under the image and links all lined up horizontally.


    If I get rid of the <br> and add a space between the img and the text,
    it works. See http://www.straffin.com/test/DUdyn2.html for my sample
    (and the code for my next questions! <grin />)

    ---snip---
    >/* DOMobjDiv.id = iterator; Why give such div an id? */

    ---snip---

    I had been trying something else and they got left behind.

    I added the next step of the code to th esample above, which works
    okay, but I'm not pleased with my "alternate" use of the ALT tag. Any
    suggestions for a different place to store "variables" in HTML? Also,
    the placement of the validation imgs are acting funny... thoughts?

    - Akbar
     
    Akbar, Sep 11, 2003
    #11
  12. Akbar

    Akbar Guest

    ATTN DU: Horiz <div>'s in IE6? How?

    On Thu, 11 Sep 2003 10:22:09 GMT, Akbar <> wrote:

    >On Thu, 11 Sep 2003 00:37:06 -0400, DU <>
    >wrote:
    >
    >>If you want all your <div>s to be on an horizontal line in MSIE 6 for
    >>Windows as well, then you'll need to make some changes to the code.

    >
    >For example? (Whether I like it or not, IE will be the target browser
    >and needs to work there above all.)


    To paraphrase Oliver -- Please sir, may I have some more (info)? :)

    - Akbar
     
    Akbar, Sep 12, 2003
    #12
  13. Akbar

    Akbar Guest

    ATTN DU: Horiz <div>'s in IE6? How? (take 2)

    On Fri, 12 Sep 2003 04:49:19 GMT, Akbar <> wrote:

    >On Thu, 11 Sep 2003 10:22:09 GMT, Akbar <> wrote:
    >
    >>On Thu, 11 Sep 2003 00:37:06 -0400, DU <>
    >>wrote:
    >>
    >>>If you want all your <div>s to be on an horizontal line in MSIE 6 for
    >>>Windows as well, then you'll need to make some changes to the code.

    >>
    >>For example? (Whether I like it or not, IE will be the target browser
    >>and needs to work there above all.)

    >
    >To paraphrase Oliver -- Please sir, may I have some more (info)? :)


    Pretty please? I'd really, really like to know what "changes" you were
    aluding to when you said that "If you want all your <div>s to be on an
    horizontal line in MSIE 6 for Windows as well, then you'll need to
    make some changes to the code."

    - Akbar
     
    Akbar, Sep 13, 2003
    #13
  14. Akbar

    Akbar Guest

    DU DU DU!!! Will you please finish your thoughts on horiz <div>'s in IE6? PLEEEEEASE!?!?!?

    On Sat, 13 Sep 2003 21:56:23 GMT, Akbar <> wrote:

    >On Fri, 12 Sep 2003 04:49:19 GMT, Akbar <> wrote:
    >
    >>On Thu, 11 Sep 2003 10:22:09 GMT, Akbar <> wrote:
    >>
    >>>On Thu, 11 Sep 2003 00:37:06 -0400, DU <>
    >>>wrote:
    >>>
    >>>>If you want all your <div>s to be on an horizontal line in MSIE 6 for
    >>>>Windows as well, then you'll need to make some changes to the code.
    >>>
    >>>For example? (Whether I like it or not, IE will be the target browser
    >>>and needs to work there above all.)

    >>
    >>To paraphrase Oliver -- Please sir, may I have some more (info)? :)

    >
    >Pretty please? I'd really, really like to know what "changes" you were
    >aluding to when you said that "If you want all your <div>s to be on an
    >horizontal line in MSIE 6 for Windows as well, then you'll need to
    >make some changes to the code."
    >
    >- Akbar


    PLEEEEEASE!?!?!

    - Akbar
     
    Akbar, Sep 17, 2003
    #14
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. gce
    Replies:
    1
    Views:
    378
    Steve C. Orr [MVP, MCSD]
    Apr 13, 2005
  2. Geoff Coope
    Replies:
    3
    Views:
    423
    Geoff Coope
    Mar 25, 2006
  3. Superman
    Replies:
    0
    Views:
    301
    Superman
    Feb 27, 2007
  4. boney
    Replies:
    1
    Views:
    604
  5. Replies:
    8
    Views:
    349
Loading...

Share This Page