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 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Oct 2006
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    help with window resize problem ... urgent !!!

    Hi everybody!

    My hair is going to fall OUT if i keep trying to fix this piece of code myself....

    Anybody has any ideas ??? Get back to me ASAP Please ... THANKS A LOT !

    The following is a piece of css code. There is an external style sheet attached to the design of the whole site.

    Presented Problems:

    1. When I resize the window to a rather small scale, the display of everything is so disordered that makes my entire layout look like a mess !!!

    2. I want the right column (#navBar) works well when i resize the window, not recklessly drifting to the bottom of the page!

    3. No horizontal bar appeared or what so ever until the window screen is squeezed almost OUT!

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <!-- DW6 --><head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>BusinessStuff</title>

    <link rel="stylesheet" href="3col_rightNav.css" type="text/css">
    </head>
    <body>
    <div id="masthead">
    <h1 id="siteName">AAA 顾问</h1>
    <p>&nbsp;</p>
    <div id="breadCrumb">
    <a href="home.htm">AAA</a> | <a href="http://www.mac-allister.com/confier_mission.php?var_menu=">AAA</a> | <a href="http://www.mac-allister.com/">AAA</a> |
    </div>
    </div>
    <div id="headlines">
    <h3>AAA</h3>
    <div id="advert">
    <a href="http://www.mac-allister.com/engagements_candidats.php?var_menu=Candidat"><img src="../images/confidential.gif" width="107" height="66" border="0"></a>
    </div>

    <p>AAA...</p>


    <table cellspacing="0" cellpadding="0">
    <tr>
    <td><img src="../images/arrow%20right.gif"></td>
    <td><a href="http://www.profileseeker.com/">Discover ProfileSeeker </a></td>
    </tr>
    </table>
    <table cellspacing="0" cellpadding="0">
    <tr>
    <td><img src="../images/arrow%20right.gif"></td>
    <td><a href="http://www.mac-allister.com/enregistrer_profil.php">Submit your profile </a></td>
    </tr>
    </table>
    <div id="advert">
    <a href="http://www.profileseeker.com/"><img src="../images/profil_seeker.gif" width="107" height="66" border="0"></a>
    </div>
    </div>
    <!-- end masthead -->
    <div id="content">
    <div class="feature">
    <h3>AAA</h3>
    <p> AAA。</p>
    </div>
    <div class="story">
    <h3> AAA</h3>
    <p>AAA </p>
    <p>AAA </p>
    <p><a href="mailto:martial.fabre@mac-allister.com">martial.fabre@mac-allister.com </a></p>
    <p>AAA </p>
    <p>AAA</p>
    <p><a href="mailto:jerome.remeur@mac-allister.com">jerome.remeur@mac-allister.com </a></p>
    <p>AAA</p>
    <p>AAA。 </p>
    <p><a href="mailto:luc.verite@mac-allister.com">luc.verite@mac-allister.com </a></p>
    <p>&nbsp;</p>
    </div>

    </div>
    <!-- end content -->
    <div id="navBar">
    <div id="sectionLinks">
    <h3>AAA</h3>
    <ul>
    <li><a href="methods.htm">AAA</a></li>
    <li><a href="commitments.htm">AAA</a></li>
    <li><a href="teams.htm">AAA</a></li>
    <li><a href="casestudies.htm">AAA</a></li>
    </ul>
    </div>
    <div class="relatedLinks">
    <h3>AAA</h3>
    <ul>
    <li><a href="http://www.mac-allister.com/selection_profils.php?var_menu=Entreprise">AAA</a></li>
    <li><a href="http://www.mac-allister.com/confier_mission.php?var_menu=Entreprise">AAA</a></li>
    </ul>
    </div>
    <div class="relatedLinks">
    <h3>AAA</h3>
    <ul>
    <li><a href="http://www.mac-allister.com/offres_emploi.php?var_menu=Candidat">AAA</a></li>
    <li><a href="http://www.mac-allister.com/enregistrer_profil.php?var_menu=Candidat">AAA</a></li>
    </ul>
    </div>
    </div>

    <!--end navBar div -->
    <div id="siteInfo">
    <a href="http://www.mac-allister.com/mentions_legales.php">Privacy Policy</a> | <a href="http://www.mac-allister.com/confier_mission.php?var_menu=">Contact Us</a> | &copy;2006 AAA
    </div>
    <br>
    </body>
    </html>

    The following is external style sheet used with the above htm.

    @charset "gb2312";
    /***********************************************/


    /***********************************************/
    /* HTML tag styles */
    /***********************************************/


    body{
    font-family: "华文彩云", "华文行楷", "新宋体", Arial;
    color: #FFFFFF;
    line-height: 1.166;
    margin: 0px;
    padding: 0px;
    background-color: #333333;
    overflow: auto;
    }


    a{
    color: #66FFFF;
    text-decoration: none;
    }

    a:link{
    color: #66FFFF;
    text-decoration: none;
    }

    a:visited{
    color: #66FFFF;
    text-decoration: none;
    }

    a:hover{
    color: #FFFF66;
    text-decoration: underline;
    }

    h1{
    font-family: "华文彩云";
    font-size: 114%;
    color: #66FFFF;
    margin: 0px;
    padding: 0px;
    }



    h3{
    font-family: Arial;
    font-size: 100%;
    color: #66FFFF;
    margin: 0px;
    padding: 0px;
    }

    h4{
    font-family: Arial;
    font-size: 100%;
    font-weight: normal;
    color: #66FFFF;
    margin: 0px;
    padding: 0px;
    }

    h5{
    font-family: Arial;
    font-size: 100%;
    color: #66FFFF;
    margin: 0px;
    padding: 0px;
    }

    ul{
    list-style-type: square;
    }

    ul ul{
    list-style-type: disc;
    }

    ul ul ul{
    list-style-type: none;
    }


    }


    /***********************************************/
    /* Layout Divs */
    /***********************************************/

    #masthead{
    padding: 10px 0px 0px 0px;
    border-bottom: 1px solid #cccccc;
    width: 100%;
    }

    #navBar{
    float: right;
    width: 20%;
    margin: 0px;
    padding: 0px;
    background-color: #666666;
    border-left: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
    }

    #headlines{
    float:left;
    width: 20%;
    border-right: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
    padding-right: 10px;
    }

    #content{
    float: left;
    width: 55%;
    }

    /***********************************************/
    /* Components */
    /***********************************************/

    #siteName{
    margin: 0;
    padding: 0 0 0 10px;
    }



    /*************** #pageName styles **************/

    #pageName{
    margin: 0px;
    padding: 0px 0px 0px 10px;
    }

    /************* #breadCrumb styles *************/

    #breadCrumb{
    font-size: small;
    padding: 2px 0px 0 10px;
    font-family: "新宋体";
    color: #66FFFF;
    background-color: #666666;
    border-top: 1px solid #cccccc;

    }


    /************** .feature styles ***************/

    .feature{
    padding: 0px 0px 10px 10px;
    font-size: 80%;
    font-family: Arial;

    }

    .feature h3{
    padding: 30px 0px 5px 0px;
    text-align: center;
    font-family: "华文行楷";
    font-size: 114%;
    }

    .feature img{
    float: left;
    padding: 10px 10px 0px 0px;
    }


    /************** .story styles *****************/

    .story{
    clear: both;
    padding: 10px 0px 0px 10px;
    font-size: 80%;
    font-family: Arial;
    }

    .story p{
    padding: 0px 0px 10px 0px;
    }


    /************* #siteInfo styles ***************/

    #siteInfo{
    clear: both;
    border: 1px solid #cccccc;
    font-size: 75%;
    color: #cccccc;
    padding: 10px 10px 10px 10px;
    font-family: Arial;
    }






    /*********** #navBar link styles ***********/

    #navBar ul a:link, #navBar ul a:visited {display: block;}
    #navBar ul {list-style: none; margin: 0; padding: 0;}

    /* hack to fix IE/Win's broken rendering of block-level anchors in lists */
    #navBar li {border-bottom: 1px solid #EEE;}

    /* fix for browsers that don't need the hack */
    html>body #navBar li {border-bottom: none;}


    /*********** #sectionLinks styles ***********/

    #sectionLinks{
    position: relative;
    margin: 0px;
    padding: 0px;
    border-bottom: 1px solid #cccccc;
    font-size: 80%;
    font-family: "新宋体";
    }

    #sectionLinks h3{
    padding: 10px 0px 2px 10px;
    }

    #sectionLinks a {
    display: block;
    border-top: 1px solid #cccccc;
    padding: 2px 0px 2px 10px;
    }

    #sectionLinks a:hover{
    background-color: #dddddd;
    }


    /*********** .relatedLinks styles ***********/

    .relatedLinks{
    margin: 0px;
    padding: 0px 0px 10px 10px;
    font-size: 80%;
    font-family: "新宋体";
    }

    .relatedLinks h3{
    padding: 10px 0px 2px 0px;
    }

    .relatedLinks a:link,
    .relatedLinks a:visited {
    display: block;
    }

    /************** #advert styles **************/

    #advert{
    padding: 30px 0px 10px;
    }

    #advert img{
    display: block;
    border: thin #66FFFF;
    }


    /************** #headlines styles **************/

    #headlines{
    margin: 0px;
    padding: 10px 0px 20px 10px;
    font-size: 80%;
    font-family: Arial;
    color: #66FFFF;
    }

    #headlines p{
    padding: 5px 0px 5px 0px;
    }

    /************** #wrapper styles **************/


    #wrapper {background: #333333;}
    .altwrapper {width:728px;}
    .mainwrapper {width:980px;}

  • #2
    Regular Coder croatiankid's Avatar
    Join Date
    Jan 2006
    Posts
    665
    Thanks
    1
    Thanked 12 Times in 12 Posts
    I'm asking that either you or a moderator put CODE tags around this 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
    •