Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    May 2010
    Location
    Connecticut - land of taxes.
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Question Help with an IE problem!

    I'm rebuilding a site and it looks great in both FF and Safari but when you view it in IE the branding bar is messed up. I've validated both my CSS and XHTML code. I can't figure this out - please help. (the form and links to other pages don't work since I've only uploaded the index and pics for this purpose. Here's the test site:

    http://suzietestsite.webs.com/

    Here's the code:

    <?php require("hostbaby"); ?>

    <!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>
    <title>Jeff Anderson</title>

    <meta name="description" content="The official website of Jeff Anderson. Find Jeff's latest news, music, videos, albums, and events." />
    <meta name="keywords" content="Jeff Anderson,official website,home page,Music,Videos" />
    <meta http-equiv="content-type" content="text/html; charset=us-ascii" />
    <link href="ja_styles.css" rel="stylesheet" type="text/css" />

    </head>

    <body>

    <!--Begin Wrapper-->
    <div id="wrapper">



    <!--Begin Branding-->
    <div id="branding">

    <h2 class="selected"><a href="http://www.jeffandersonmuse.com">jeffandersonmuse.com</a></h2>

    <h2>
    <a class="bio" href="bio.html">Bio</a>
    <a class="calendar" href="calendar.html">Calendar</a>
    <a class="photos" href="photos.html">Photos</a>
    <a class="music" href="music.html">Music</a>
    <a class="store" href="store.html">Store</a>
    </h2>

    </div>
    <!-- End branding -->



    <!--Begin Main Content Header-->
    <div id="mcolheader">

    <h2>News</h2>

    </div>
    <!--End Main Content Header-->




    <!--Begin Main Content-->
    <div id="main">

    <table class="main" summary="news">
    <tr>
    <td><?php show_news() ?></td>
    </tr>
    </table>

    </div>
    <!--End Main Content-->




    <!--Begin Right Column Header-->
    <div id="rcolheader">

    <h2>Contacts</h2>

    </div>
    <!--End Right Column Header-->




    <!--Begin Right Column-->
    <div id="rightcolumn">

    <p>Join the mailing list!</p>

    <!-- This page just collects the info and names it. The next page "emailit.html" will actually do the emailing -->

    <form action="emailit.html" method="post">

    <table>

    <tr><td>Your@Email:</td></tr>

    <tr><td><input type="text" size="40" maxlength="127" name="email" /></td></tr>

    </table>

    <p class="submit"><input type="submit" value="JOIN" /></p>

    </form>

    <!-- FORM IS OVER. BACK TO YOUR REGULAR HTML CODE. -->


    <p><a href="http://www.digstation.com/AlbumDetails.aspx?albumID=ALB000019998">
    <img height="75" width="165" alt="www.digstation.com" src="links/digstation.gif" /></a></p>

    <p><a href="http://www.facebook.com/pages/Jeff-Anderson/35222011104">
    <img height="38" width="160" alt="Facebook" src="links/facebook_badge.jpg" /></a></p>

    <p><a href="http://www.myspace.com/jandersonmuse">
    <img height="49" width="157" alt="myspace.com" src="links/myspace_badge.png" /></a></p>

    <p><a href="http://cdbaby.com/cd/jeffanderson">
    <img height="74" width="234" alt="www.cdbaby.com" src="links/cdbabylogo.gif" /></a></p>

    <p><a href= "http://phobos.apple.com/WebObjects/MZStore.woa/wa/viewAlbum?i=284354016&amp;id=284353843&amp;s=143441">
    <img height="71" width="56" alt="iTunes" src="links/itunes_logo.jpg" /></a></p>

    <h2><a href="mailto:webmaster@musicinmyheadrecords.com">Contact Us</a></h2>

    </div>
    <!--End Right Column-->




    <!--Begin Footer-->
    <div id="footer">

    <p>&copy; 2010 JeffAndersonMuse.com. All Rights Reserved.&nbsp;|&nbsp;<em>Site design by &nbsp;<a href="mailto:spkinosh@comcast.net">Suzie K. Designs</a></em></p>

    </div>
    <!--End Footer-->

    </div>
    <!--/ End Wrapper-->

    </body>

    </html>




    And the CSS:

    /* ja_styles.css */



    /* Universal style rule */
    * {
    margin: 0;
    padding: 0;
    }



    body {
    background-image: url("pics/jabkgd.png");
    background-color: #E6E6E6;
    text-align: center;
    font-family: "Palatino Linotype", Palatino, "MgOpen Canonica", "DejaVu Serif", serif;
    font-size: 1em;
    color: #CCCCCC;
    }



    #wrapper {
    width: 60em;
    background-color: #272b2e;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    border-left: thin solid #CCCCCC;
    border-right: thin solid #CCCCCC;
    }



    /********** Branding division styles **********/



    #branding {
    height: 2em;
    text-transform: uppercase;
    background-color: #000000;
    text-align: left;
    border-bottom: thin solid #CCCCCC;
    padding: 1em;
    }


    #branding h2 {
    margin-right: 0.5em;
    }
    #branding h2.selected a:link, #branding h2.selected a:visited {
    color: #028482;
    }
    #branding h2.selected a:hover {
    color: #FFFFFF;
    }


    a.bio {
    right: 20em;
    }
    a.calendar {
    right:13.5em;
    }
    a.photos {
    right: 8.5em;
    }
    a.music {
    right: 4.5em;
    }
    a.store {
    right: .5em;
    }



    /********** Right Header division styles **********/



    #rcolheader {
    width: 17em;
    float: right;
    text-align: left;
    position: absolute;
    top: 4.05em;
    right: 0;
    background-color: #555555;
    padding: 1em;
    color: #000000;
    height: 1.5em;
    border-top: thin solid #CCCCCC;
    }

    #rcolheader h2 {
    color: #FFFFFF;
    font-weight: bold;
    text-transform: uppercase;
    text-align: left;
    }



    /********** Right Column division styles **********/



    #rightcolumn {
    width: 17em;
    float: right;
    text-align: left;
    position: absolute;
    top: 8em;
    right: 0;
    background-color: #272b2e;
    padding: 1em;
    }

    #rightcolumn p {
    margin: 1em;
    text-align: center;
    }

    #rightcolumn h2 {
    margin: 1em;
    text-align: center;
    }



    /********** Main Header division styles **********/



    #mcolheader {
    margin: 0 19em 0 0;
    background-color: #333333;
    padding: 1em;
    height: 1.5em;
    border-top: thin solid #CCCCCC;
    text-align: left;
    }

    #mcolheader h2 {
    color: #FFFFFF;
    font-weight: bold;
    text-transform: uppercase;
    text-align: left;
    }



    /********** Main Content division styles **********/



    #main {
    margin: 0 19em 0 0;
    background-color: #1A1A1A;
    background-image: url("pics/kiss.jpg");
    padding: 1em;
    text-align: left;
    color: #000000;
    height:50em;
    }

    #main p {
    text-align: left;
    line-height: 1.5em;
    padding: 0.5em;
    text-align: left;
    }

    table.main {
    text-align: left;
    padding: 10px;
    width: 100%;
    border-collapse: separate;
    margin-left: auto;
    margin-right: auto;
    }



    /********** Footer division styles **********/



    #footer {
    height: 2em;
    background-color: #4D4D4D;
    text-align: left;
    border-top: thin solid #CCCCCC;
    padding: 1em;
    clear: both;
    }

    #footer p {
    margin: 0.5em;
    color: #000000;
    }




    /********** Link styles **********/

    #branding a {
    position: absolute;
    text-decoration: none;
    font-size: 1em;
    }

    a {
    text-decoration: none;
    font-size: 1em;
    text-align : center;
    }

    a:link {color:#CCCCCC;} /* unvisited link */
    a:visited {color:#CCCCCC;} /* visited link */
    a:hover {color:#028482;} /* mouse over link */
    a:active {color:#FFFFFF;} /* selected link */



    /********** Print styles **********/



    @media print{
    /* Start printer-friendly styles */

    /* Make wrapper the full page width */
    #wrapper{
    width:100%;
    }

    /* Hide rightcolumn, navbar,and footer */
    #rightcolumn,
    #branding,
    #footer{
    display:none;
    }

    /* Get rid of content div margins and
    padding. Use a different font for print */
    #main{
    margin:0;
    padding:0;
    font-family:'Century Schoolbook', Times, Serif;
    font-size:1em;
    }
    }

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Start with fixing the errors in your markup, see http://validator.w3.org/check?uri=ht...site.webs.com/
    <?php require("hostbaby"); ?>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    and you've an unparsed php code at the top of your doctype, which will turn IE into quirks mode.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • Users who have thanked abduraooft for this post:

    spkinosh (05-13-2010)

  • #3
    New to the CF scene
    Join Date
    May 2010
    Location
    Connecticut - land of taxes.
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thank you, abduraooft! Removing the php code fixed the issue. I'll leave it out until I'm ready to put that piece in place. (Funny that when I validate by file upload I get no errors, but when I validate by url I did).


  •  

    Posting Permissions

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