www.webdeveloper.com
Results 1 to 4 of 4

Thread: My site in IE6 - NEED HELP

  1. #1
    Join Date
    Apr 2005
    Location
    Behind my DiGiCo SD7 Console
    Posts
    900

    My site in IE6 - NEED HELP

    My site in IE6 looks horriable.

    The red bar below the header is too big

    The navigation image to the left has a grey background.

    http://www.esctonline.com/new

    Can you please help with this?
    Registered Linux User: #463250
    -----------------
    HELPFUL LINKS
    PHP - http://www.php.net
    Website Color Schemer - http://www.colorschemer.com/online.html

  2. #2
    Join Date
    Dec 2005
    Location
    American, living in Toronto, ON. CANADA
    Posts
    6,746
    <div style="height:22px; font-size:0.9em; background-color:red; color:white; padding:0 5px 0;">
    <p style="width:40%; float:left; line-height:1.0em; padding:4px 0 2px 0; font-weight:bold;">Welcome to Entertainment Solutions</p>

    <p style="width:40%; float:right; font-size:1.0em; text-align:right; background-color:red; color:white; padding:1px 0 0 0;"><img src="http://www.esctonline.com/new/images/lock.png" alt="Secure Area" style="vertical-align:middle;">&nbsp;<a href="http://clients.esctonline.com" style=" line-height:0.3em;color:white; margin:0 0 3px 6px;">Client Login</a>&nbsp;|&nbsp;<a href="http://photoweb.esctonline.com" style="color:white; padding-bottom:3px; ">Photoweb Login</a></p>
    </div>
    Needs to be refined to elegance, but this works.
    I build for: Firefox and tweak for IE

  3. #3
    Join Date
    Apr 2005
    Location
    Behind my DiGiCo SD7 Console
    Posts
    900
    What do you mean by this?

    Needs to be refined to elegance

    How do I get my background PNG to show transparent instead of grey?
    the master is transparent.
    Registered Linux User: #463250
    -----------------
    HELPFUL LINKS
    PHP - http://www.php.net
    Website Color Schemer - http://www.colorschemer.com/online.html

  4. #4
    Join Date
    Dec 2005
    Location
    American, living in Toronto, ON. CANADA
    Posts
    6,746
    Quote Originally Posted by shawnmichaels
    What do you mean by this?

    1) Needs to be refined to elegance

    2) How do I get my background PNG to show transparent instead of grey?
    the master is transparent.
    1) -Needs to have the "inline style" be moved to "internal" CSS, or "external" CSS file. Could be reduced, compacted. Basically, this code is bloat-ugly. "Refine", to improve upon. CSS is "presentational" (how it looks) and should be outside of the HTML, which is "content" (the actual 'content' of course).

    2) To teach IE how to correctly handle *png images, add this *js either internally, or create an external link (external is preferred, esp. if you have several *png images and upon several pages... saves having to re-load this internally on every page-load) :

    Code:
    <!--[if lt IE 7]>
    <script language="JavaScript">
    function correctPNG() // correctly handle PNG transparency in Win IE 5.5 & 6.
    {
       var arVersion = navigator.appVersion.split("MSIE")
       var version = parseFloat(arVersion[1])
       if ((version >= 5.5) && (document.body.filters)) 
       {
          for(var i=0; i<document.images.length; i++)
          {
             var img = document.images[i]
             var imgName = img.src.toUpperCase()
             if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
             {
                var imgID = (img.id) ? "id='" + img.id + "' " : ""
                var imgClass = (img.className) ? "class='" + img.className + "' " : ""
                var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
                var imgStyle = "display:inline-block;" + img.style.cssText 
                if (img.align == "left") imgStyle = "float:left;" + imgStyle
                if (img.align == "right") imgStyle = "float:right;" + imgStyle
                if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
                var strNewHTML = "<span " + imgID + imgClass + imgTitle
                + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
                + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
                + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" 
                img.outerHTML = strNewHTML
                i = i-1
             }
          }
       }    
    }
    window.attachEvent("onload", correctPNG);
    </script>
    <![endif]-->
    Last edited by WebJoel; 11-06-2007 at 06:26 PM.
    I build for: Firefox and tweak for IE

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles