CSS and javascript

Discussion in 'HTML' started by Terry, May 29, 2006.

  1. Terry

    Terry Guest

    Hello,

    During the past 2 days in an effort to learn CSS I've read 2 books and
    today I've started the process of redesigning our footer. I've run into
    an issue whereas I can't figure out how to float text around an image
    produced by javascript. Any help will be greatly appreciated.

    The footer in development is ...
    http://www.4everhers.com/dev/footer.asp

    The footer I want it to look like is on any other page.

    Thanks,
    Terry
    Terry, May 29, 2006
    #1
    1. Advertising

  2. Terry

    BootNic Guest

    > "Terry" <RE_MOVE_THIS**> wrote:
    > news:....
    >
    > Hello,
    >
    > During the past 2 days in an effort to learn CSS I've read 2 books
    > and today I've started the process of redesigning our footer. I've
    > run into an issue whereas I can't figure out how to float text
    > around an image produced by javascript. Any help will be greatly
    > appreciated.
    >
    > The footer in development is ...
    > http://www.4everhers.com/dev/footer.asp
    >
    > The footer I want it to look like is on any other page.



    IE http://files.photojerk.com/BootNic/00.png
    Opera http://files.photojerk.com/BootNic/01.png
    Mozilla http://files.photojerk.com/BootNic/02.png

    I am not sure, but I do not think these are the results you expected. You may wish
    to make your example just a little more flexible.

    --
    BootNic Monday, May 29, 2006 7:12 PM

    Assert your right to make a few mistakes. If people can't accept your
    imperfections, that's their fault.
    *Dr. David M. Burns*
    BootNic, May 30, 2006
    #2
    1. Advertising

  3. Terry

    Mark Parnell Guest

    Deciding to do something for the good of humanity, Terry
    <RE_MOVE_THIS**> declared in alt.html:

    > I've run into
    > an issue whereas I can't figure out how to float text around an image
    > produced by javascript.


    Why use Javascript for the image?

    --
    Mark Parnell
    My Usenet is improved; yours could be too:
    http://blinkynet.net/comp/uip5.html
    Mark Parnell, May 30, 2006
    #3
  4. Terry

    Terry Guest

    Mark Parnell wrote:
    > Deciding to do something for the good of humanity, Terry
    > <RE_MOVE_THIS**> declared in alt.html:
    >
    >> I've run into
    >> an issue whereas I can't figure out how to float text around an image
    >> produced by javascript.

    >
    > Why use Javascript for the image?
    >


    The javascript displays a COMODO SSL logo which displays our validation
    information real-time. I have to use javascript --- so I believe.

    I figured out the problem ... It was totally user error. I stopped
    working on it for a couple of hours and when I came back I realized that
    I had put the javascript and the span statement in the wrong location.
    Should've been moved up "above" the text that I wanted to float around it.

    I'm wondering if I can get help with something else. The footer
    displays fine in IE and Opera but not Firefox. I've read that there are
    various hacks that you have to do sometimes. Can anyone give me an idea
    as how to make the right side line up?

    Thanks!
    Terry, May 30, 2006
    #4
  5. Terry

    Mark Parnell Guest

    Deciding to do something for the good of humanity, Terry
    <RE_MOVE_THIS**> declared in alt.html:

    > The javascript displays a COMODO SSL logo which displays our validation
    > information real-time. I have to use javascript --- so I believe.


    So what happens for visitors with Javascript disabled/unavailable?

    > I figured out the problem ... It was totally user error.


    <g>

    > I'm wondering if I can get help with something else. The footer
    > displays fine in IE and Opera but not Firefox.


    Sorry, but I know from previous posts that you've made that the content
    of your site is not something I want to be looking at - especially at
    work. No doubt someone else will be able to help though.

    --
    Mark Parnell
    My Usenet is improved; yours could be too:
    http://blinkynet.net/comp/uip5.html
    Mark Parnell, May 30, 2006
    #5
  6. Terry

    Terry Guest

    Mark Parnell wrote:
    > Deciding to do something for the good of humanity, Terry
    > <RE_MOVE_THIS**> declared in alt.html:
    >
    >> The javascript displays a COMODO SSL logo which displays our validation
    >> information real-time. I have to use javascript --- so I believe.

    >
    > So what happens for visitors with Javascript disabled/unavailable?
    >
    >> I figured out the problem ... It was totally user error.

    >
    > <g>
    >
    >> I'm wondering if I can get help with something else. The footer
    >> displays fine in IE and Opera but not Firefox.

    >
    > Sorry, but I know from previous posts that you've made that the content
    > of your site is not something I want to be looking at - especially at
    > work. No doubt someone else will be able to help though.
    >


    Yep, you're right Mark. And I do apologize! I generally include a
    disclaimer stating that we sell lingerie and therefore display pictures
    of women wearing such.

    As for javascript, I'm really not sure what I can do. The method for
    displaying the logo is set by Comodo. I will go to there site and look
    to se if there's an alternative, but I don't think so.

    Terry
    Terry, May 30, 2006
    #6
  7. Terry

    Mark Parnell Guest

    Deciding to do something for the good of humanity, Terry
    <RE_MOVE_THIS**> declared in alt.html:

    > Yep, you're right Mark. And I do apologize! I generally include a
    > disclaimer stating that we sell lingerie and therefore display pictures
    > of women wearing such.


    That's OK - I recognised the domain name. :)

    If you can create a page with your new footer without photos, I'm more
    than happy to have a look.

    > As for javascript, I'm really not sure what I can do. The method for
    > displaying the logo is set by Comodo. I will go to there site and look
    > to se if there's an alternative, but I don't think so.


    Yeah, if it's a 3rd-party thing you don't have much choice. Can't hurt
    to check with them though - they really *should* provide a better
    alternative.

    --
    Mark Parnell
    My Usenet is improved; yours could be too:
    http://blinkynet.net/comp/uip5.html
    Mark Parnell, May 30, 2006
    #7
  8. Terry

    Terry Guest

    Mark Parnell wrote:
    > Deciding to do something for the good of humanity, Terry
    > <RE_MOVE_THIS**> declared in alt.html:
    >
    >> Yep, you're right Mark. And I do apologize! I generally include a
    >> disclaimer stating that we sell lingerie and therefore display pictures
    >> of women wearing such.

    >
    > That's OK - I recognised the domain name. :)
    >
    > If you can create a page with your new footer without photos, I'm more
    > than happy to have a look.
    >
    >> As for javascript, I'm really not sure what I can do. The method for
    >> displaying the logo is set by Comodo. I will go to there site and look
    >> to se if there's an alternative, but I don't think so.

    >
    > Yeah, if it's a 3rd-party thing you don't have much choice. Can't hurt
    > to check with them though - they really *should* provide a better
    > alternative.
    >


    Nothing but a footer "here" ...
    http://www.4everhers.com/dev/footer.asp

    I just need to get the right side to line up. Well, that's not all. As
    BootNic pointed out, I need to correct the problem of discombobulation
    when the text size is increased. But I'm learning and I'll tackle that
    issue "next" week.

    Thanks
    Terry, May 30, 2006
    #8
  9. Terry

    Mark Parnell Guest

    Deciding to do something for the good of humanity, Terry
    <RE_MOVE_THIS**> declared in alt.html:

    > Nothing but a footer "here" ...
    > http://www.4everhers.com/dev/footer.asp


    Well why didn't you say so? :)

    > I just need to get the right side to line up.


    Line up with what? The menu?

    > Well, that's not all. As
    > BootNic pointed out, I need to correct the problem of discombobulation
    > when the text size is increased. But I'm learning and I'll tackle that
    > issue "next" week.


    TBH, I think you're going to need to largely rewrite it to get it to
    adjust nicely with larger font sizes, so you might as well do that
    first.

    --
    Mark Parnell
    My Usenet is improved; yours could be too:
    http://blinkynet.net/comp/uip5.html
    Mark Parnell, May 30, 2006
    #9
  10. Terry

    Terry Guest

    Mark Parnell wrote:
    > Deciding to do something for the good of humanity, Terry
    > <RE_MOVE_THIS**> declared in alt.html:
    >
    >> Nothing but a footer "here" ...
    >> http://www.4everhers.com/dev/footer.asp

    >
    > Well why didn't you say so? :)
    >
    >> I just need to get the right side to line up.

    >
    > Line up with what? The menu?
    >
    >> Well, that's not all. As
    >> BootNic pointed out, I need to correct the problem of discombobulation
    >> when the text size is increased. But I'm learning and I'll tackle that
    >> issue "next" week.

    >
    > TBH, I think you're going to need to largely rewrite it to get it to
    > adjust nicely with larger font sizes, so you might as well do that
    > first.
    >


    It was in an earlier post. It appears to display fine in IE and Opera
    but in Firefox the right side does not line up.

    I will completely redo it this time focusing on text resizing. Anyway,
    it's the best way to learn! Thanks for looking Mark.

    Terry
    Terry, May 30, 2006
    #10
  11. Terry

    BootNic Guest

    > "Terry" <RE_MOVE_THIS**> wrote:
    > news:....


    [snip]

    > I'm wondering if I can get help with something else. The footer
    > displays fine in IE and Opera but not Firefox. I've read that
    > there are various hacks that you have to do sometimes. Can anyone
    > give me an idea as how to make the right side line up?


    The first thing I notice is that you have not given a doctype.

    IMHO its much easier to work with when you give a document a doctype that
    puts the document in standard compliance mode.

    If you were to give your footer a doctype :

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

    you would find that is not likely the results you want in any of your test browsers,
    but it would be more consistent.

    At any rate, here is something you can go through and figure out what it all does.

    Files used in the HTML example:

    http://i.1asphost.com/BootNic/temp/hover.htc

    http://i.1asphost.com/BootNic/temp/mainTestlte7.css

    http://i.1asphost.com/BootNic/temp/mainTestlte6.css

    Example:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <link rel="stylesheet" href=
    "http://i.1asphost.com/BootNic/temp/mainTest.css" type="text/css">
    <!--[if lte IE 7]>
    <link rel="stylesheet"
    href="http://i.1asphost.com/BootNic/temp/mainTestlte7.css" type="text/css">
    <![endif]-->
    <!--[if lte IE 6]>
    <link rel="stylesheet"
    href="http://i.1asphost.com/BootNic/temp/mainTestlte6.css" type="text/css">
    <![endif]-->
    <title></title>
    </head>
    <body>
    <div id="menu">
    <div>
    <p>Shopping</p>
    <ul>
    <li><a href=
    "https://www.4everhers.com/4store/pc/Custva.asp?redSSL=1">My
    Account</a></li>
    <li><a href=
    "http://www.4everhers.com/ctp/reward-points.asp">Reward
    Points</a></li>
    <li><a href=
    "http://www.4everhers.com/ctp/reward-points.asp">Reward
    Points</a></li>
    </ul>
    </div>
    <div>
    <p>Departments</p>
    <ul>
    <li><a href=
    "http://www.4everhers.com/4store/pc/viewCat_h.asp?idCategory=4">
    Sexy Lingerie</a></li>
    <li><a href=
    "http://www.4everhers.com/4store/pc/viewCat_h.asp?idCategory=24">
    Romance &amp; Fantasy</a></li>
    <li><a href=
    "http://www.4everhers.com/4store/pc/viewCat_h.asp?idCategory=24">
    Romance &amp; Fantasy</a></li>
    </ul>
    </div>
    <div>
    <p>Helpdesk</p>
    <ul>
    <li><a href=
    "http://www.4everhers.com/ctp/size-chart.asp">Size
    Chart</a></li>
    <li><a href=
    "http://www.4everhers.com/ctp/lingerie-definitions.asp">Lingerie
    Definitions</a></li>
    <li><a href=
    "http://www.4everhers.com/ctp/lingerie-definitions.asp">Lingerie
    Definitions</a></li>
    </ul>
    </div>
    <div>
    <p>Information</p>
    <ul>
    <li><a href="http://www.4everhers.com/ctp/about-us.asp">About
    Us</a></li>
    <li><a href=
    "http://www.4everhers.com/ctp/contact-us.asp">Contact
    Us</a></li>
    <li><a href="http://www.4everhers.com">Home</a></li>
    </ul>
    </div>
    <div>
    <p>Webmasters</p>
    <ul>
    <li><a href=
    "http://www.4everhers.com/links/webmasters-add-link.asp">Add
    a Link</a></li>
    <li><a href=
    "http://www.4everhers.com/links/webmasters-modify-link.asp">Modify
    a Link</a></li>
    <li><a href=
    "http://www.4everhers.com/links/webmasters-modify-link.asp">Modify
    a Link</a></li>
    </ul>
    </div>
    </div>
    <div id="ssi">
    <div class="borderright">
    <p><span style="float:right;"><img src=
    "http://www.4everhers.com/images/instantssl_site_seal.gif" alt=
    ""></span>Shop 4everHers.com in complete confidence. You are
    protected by the world-class safety of SSL <a href=
    "http://www.4everhers.com/ctp/security.asp">Secure
    Shopping</a>. COMODO is a world leader in ensuring Identity
    Trust &amp; Assurance on the web. If there is any way we can
    improve your shopping experience, please <a href=
    "http://www.4everhers.com/ctp/contact-us.asp">Contact
    Us</a>.</p>
    </div>
    <div>
    <p><span style="float:left;"><img src=
    "http://www.4everhers.com/images/creditcards.gif" alt="">Click
    to Verify</span>Copyright &copy; 4everHers, 2006. All rights
    reserved. Images used herein are protected by copyright of
    either 4everHers, the manufacturer of the goods, or stock photo
    agencies and cannot be reprinted or sold without the written
    permission of the copyright holder. <a href=
    "/StoreMap.html">Site Map</a></p>
    </div>
    </div>
    </body>
    </html>

    --
    BootNic Tuesday, May 30, 2006 9:01 PM

    Good communication is as stimulating as black coffee and just as hard
    to sleep after.
    *Anne Morrow Lindbergh*
    BootNic, May 31, 2006
    #11
  12. Terry

    Terry Guest

    BootNic wrote:
    >> "Terry" <RE_MOVE_THIS**> wrote:
    >> news:....

    >
    > [snip]
    >
    >> I'm wondering if I can get help with something else. The footer
    >> displays fine in IE and Opera but not Firefox. I've read that
    >> there are various hacks that you have to do sometimes. Can anyone
    >> give me an idea as how to make the right side line up?

    >
    > The first thing I notice is that you have not given a doctype.
    >

    <snip>
    Yep, I'm working on getting a doctype declared. The problem is that
    when I declare a doctype the footer gets thrown out of whack in IE. I
    know that indicates a problem with the code, a problem I could not find.
    So I figured I would just recreate the footer from scratch using CSS
    since I want to learn it anyway. Once recreated I'll add the doctype to
    the header of all pages. I hope my strategy is correct.

    I kind of inherited this problem and I'm determined to fix it. I'm not a
    programmer so there's a learning curve.

    I'll have a look at the links you provided later this evening. Thanks.
    Terry, May 31, 2006
    #12
    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. tom watson

    print.css and screen.css

    tom watson, Sep 9, 2003, in forum: HTML
    Replies:
    1
    Views:
    452
    Jukka K. Korpela
    Sep 9, 2003
  2. =?ISO-8859-1?Q?G=E9rard_Talbot?=

    Whining and bitching about MSIE 6 CSS bugs and CSS support

    =?ISO-8859-1?Q?G=E9rard_Talbot?=, Jul 9, 2005, in forum: HTML
    Replies:
    0
    Views:
    403
    =?ISO-8859-1?Q?G=E9rard_Talbot?=
    Jul 9, 2005
  3. Julie Siebel
    Replies:
    4
    Views:
    128
    Dr John Stockton
    Feb 25, 2004
  4. Replies:
    1
    Views:
    202
    Randy Webb
    Feb 19, 2006
  5. Replies:
    7
    Views:
    191
Loading...

Share This Page