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

Thread: CSS help

  1. #1
    New to the CF scene
    Join Date
    Mar 2005
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Angry CSS help

    Hi, can someone help me with this css. I am new and learning this css. When open this file, after photos and news list links, whatever i do it doesn't seem to work in both IE and Mozilla. Can somebody tell me what was wrong in my doing.
    Appreciate your help. Krs please find the attachment.
    Attached Files Attached Files

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,253
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Link?

    I can't open zips (company firewall...); any chance of supplying a link to the page online? It works much better anyway when people can view the actual page in their browser.
    Also, could you decribe in a little more detail what is "not working" between the two browsers? It'll help people zooming in onthe problem at hand.
    Regards,
    Ronald.
    ronaldvanderwijden.com

  • #3
    Regular Coder Ranger56's Avatar
    Join Date
    Mar 2005
    Location
    Kent, WA.
    Posts
    783
    Thanks
    0
    Thanked 0 Times in 0 Posts
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html>
    <head>
    <title>test1</title>

    <style type="text/css">
    <!--
    html, body {
    margin: 0px; padding: 0px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 12px;
    height: 100%;
    }
    #wrapper {
    background: #ffffff;
    margin: 0 auto;
    padding: 0px;
    position: relative;
    height: 100%;
    width: 760px;
    border-left: 1px solid #f2f2f2;
    border-right: 1px solid #f2f2f2;
    }
    #header {
    background-color: #61943a;
    height: 90px; margin: 0px; padding: 0px;
    background-image: url "images/top_banner.jpg";
    background-repeat: no-repeat;
    border-bottom: 1px solid #ffffff;
    }
    #logo {
    margin: 10px 0px 0px 10px;
    padding: 0px;
    width: 180px;
    height: 62px;
    float: left;
    }
    #flags {
    width: 50px; height: 24px; float: right; margin: 12px 12px 0px 0px;
    }
    #navigBox {
    margin: 0px; padding: 0px; background-color: #ffcc00;
    height: 32px; width: 100%;
    }
    #nav {
    background-color: #99cc66;
    width: 556px;
    height: 32px;
    line-height: 32px;
    margin-left: 10px;
    }
    #nav ul {
    margin: 0px;
    padding: 0px;
    }
    #nav li {
    float: left;
    margin: 0px;
    padding: 0px;
    list-style-type: none;
    border-left: 1px solid #ffffff;
    }
    #nav li a {
    display: block;
    width: 110px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 10px;
    font-weight: bold;
    color: White;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    }
    #nav li a:hover {
    display: block;
    width: 110px;
    font-size: 10px;
    font-weight: bold;
    color: black;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    background-color: #ffcc00;
    }
    #homeTxtBox {
    margin-top: 12px; padding: 0px; float: left; height: 120px; width: 100%; position: relative;
    }
    #photoBox {
    margin: 0 auto; background-color: #f2f2f2; width: 520px; height: 160px;
    position: relative; float: left; padding: 6px;
    border-left: 6px solid #ffffff;
    background-repeat: no-repeat;
    }
    #newsBox {
    margin: 0 auto; background-color: #f2f2f2; width: 198px; height: 160px;
    float: left; border-left: 6px solid #ffffff; padding: 6px;
    }
    .mylist {
    font-family: Arial, Verdana, Tahoma; font-size: 11px; margin: 0px; padding: 0px;
    }
    .mylist ul {
    margin: 0px; padding: 0px; list-style-type: none;
    }
    .mylist li a {
    margin: 0px; padding: 0px; list-style-type: none; text-decoration: none;
    display: block; width: 190px; color: #000; border-bottom: 1px solid #fff;
    }
    .mylist li a:hover {
    margin: 0px; padding: 0px; list-style-type: none; text-decoration: none;
    display: block; width: 190px; color: #FF7F50; border-bottom: 1px solid #fff;
    }
    #mainContent {
    clear: both;
    width: 750px; margin: 0 auto; padding: 0px; float: left;
    background-color: #D5DCE3; border-top: 6px solid #666;
    }
    #footer {
    clear: both;
    width: 752px;
    height: 26px;
    background-color: #66ccff;
    border-top: 6px solid #ffffff;
    bottom: 0px;
    position: absolute;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 10px;
    margin: 0px; padding: 6px 2px 2px 6px;
    }
    a {
    text-decoration: none; color: #ffffff;
    }
    a:hover {
    text-decoration: underline; color: #000000;
    }


    -->
    </style>
    </head>

    <body>
    <div id="wrapper"><!--page container-->
    <div id="header"><!--Topmost header begins-->
    <div id="logo"><img src="images/logo.gif" height="62" width="180"></div><!--Logo goes here-->
    <div id="flags"><a href="#"><img src="images/flgenglish.gif" height="13" width="20" alt="Englsih" border="0"></a> &nbsp;<a href="#"><img src="images/flgthai.gif" height="13" width="20" alt="Thai" border="0"></a></div>

    </div><!--Topmost header ends-->
    <div id="navigBox"><!--navigation background-->
    <div id="nav"><!--Main navigation begins-->
    <ul>
    <li><a href="#">about us</a></li>
    <li><a href="#">Objectives</a></li>
    <li><a href="#">News / Events</a></li>
    <li><a href="#">FAQs</a></li>
    <li><a href="#">contact us</a></li>
    </ul>
    </div><!--Main navigation ends-->
    </div><!--Navigation background ends-->

    <div id="homeTxtBox">
    <div id="photoBox"><img src="images/homeimg.jpg" height="150" width="516" align="Friends Photos" border="0"></div><!--Photo container-->
    <div id="newsBox"><div class="mylist">
    <ul>
    <li><a href="#">This is to test how it works. This is to test how it works. This is to test how it works.</a></li>
    <li><a href="#">This is to test how it works. This is to test how it works. This is to test how it works.</a></li>
    <li><a href="#">This is to test how it works. This is to test how it works.</a></li>
    <li><a href="#">This is to test how it works. This is to test how it works. This is to test how it works.</a></li>
    </ul>
    </div>
    </div><!--News list container-->
    </div><!--homepage text/news/photos container-->
    <div id="maincontent">This is main content.</div>

    <div id="footer">All Rights Reserved to TAFS Thailand | Design & Development by <a href="http://www.nzonebkk.com" target="_blank">NZONE Bangkok</a></div>
    </div><!--main container ends here-->
    </body>
    </html>


    Try that it worked for me. I couldn't see the link to the arrow anywhere in the code...


  •  

    Posting Permissions

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