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 6 of 6

Thread: IE Hack Needed

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

    IE Hack Needed

    Help. My boxes that should be in the right column on this page:

    http://www.radiantplumbing.com/services

    Are displaying incorrectly at the bottom of the page in IE 6 and earlier. IE 7 and Firefox 2 are fine. Do I need a hack for IE or am I just missing something more basic in the CSS? Please advise.

    Frank

  • #2
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #3
    New to the CF scene
    Join Date
    May 2005
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm still lost. I know it has to do with the three columns and clearing, but can't diagnose it. Could someone be more specific?

  • #4
    Regular Coder
    Join Date
    Feb 2007
    Location
    Canada
    Posts
    924
    Thanks
    10
    Thanked 56 Times in 55 Posts
    It is very difficult to assist you when there are several css files, scripts and junk to work with. If you could delete the bulk of the un-necessary information andpare the problem down to its core, and present the css as a workable file, someone might take a stab at it, but you are correct, it would appear to be an IE6 float issue.

    Might be easily fixed, but I don't feel like wading through all those fluffy CSS files to do that. We are here to help you, so please help us do that.

  • #5
    New to the CF scene
    Join Date
    May 2005
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Code

    No problem. Here is the applicable style sheet (main.css):

    Code:
    /* General
    --------------------------------------- */
    
    .left {float: left; margin-right: 1em;}
    
    .right {float: right; margin-left: 1em;}
    
    .small {font-size: smaller;}
    
    .hide {display: none;}
    
    p, ul, ol { font-size:1em; line-height: 1.5em; margin:0 0 .7em 0;}
    
    ol {margin-left: 0.75em; padding-left: 2em;}
    
    ul {margin-left: 0.75em; }
    
    ul li { list-style: none; background: url(images/bullet.gif) no-repeat left 0.2727em; padding-left: 1.3636em;}
    
    ol li { list-style: decimal outside;}
    
    ol ol li {list-style: lower-alpha outside;}
    
    ol ol, ul ul {margin-bottom: 0;}
    
    /* Structure and Layout
    --------------------------------------- */
    
    body {
    background-image: url(images/metaltile.jpg);
    background-repeat: repeat-x;
    background-position: top left;
    margin: 0px;
    padding: 0;
    color: #663300;
    text-align: center;
    font-family: "Trebuchet MS", verdana, arial, helvetica, sans-serif;
    font-size: 85%;
    line-height: 1.3em;
    }
    
    #frame {
    text-align: left;
    margin: 0em auto;
    width: 1024px;
    background: url(images/frametile_1024.jpg) repeat-y center top;
    }
    
    .oneCol #frame {background-image: url(images/cardboardtile.jpg) repeat-y;}
    
    #header {
    background: url(images/header_bg.jpg) no-repeat center top;
    height: 393px;
    }
    
    #middlebar {
    background: url(images/greentilemiddle.gif) no-repeat center top;
    height: 54px;
    }
    
    #container {
    margin: 0 0 0 0;
    float: left;
    display: inline;
    width: 674px;
    }
    
    * html #container {margin: 0 0 0 11px;}
    
    .oneCol #container {
    width: 707px;
    }
    
    #mainCol, #feature {padding: 0 0 0 0;}
    
    .home #mainCol {
    display: inline;
    float: right;
    width: 485px;
    }
    
    #subCol {display: none;}
    
    .home #subCol {
    float: left;
    display: inline;
    width: 165px;
    }
    
    #extraCol {
    float: right;
    width: 350px;
    display: inline;
    }
    
    .oneCol #extraCol {
    display: none;
    }
    
    #footer {
    clear: both;
    background: url(images/footer_bg.gif) no-repeat center bottom;
    height:118px;
    }
    
    /* Links
    --------------------------------------- */
    
    a, a:link, a:visited {
    color: #CF660A;
    font-weight: bold;
    text-decoration: none;
    }
    
    a:visited {
    color: #CF660A;
    }
    
    a:hover, a:active {
    text-decoration: underline;
    }
    
    a img {border: none;}
    
    
    /* Navigation
    --------------------------------------- */
    
    #navigation {
    margin: 19px 21px;
    float: right;
    padding: 0 10px;
    height: 1em;
    }
    
    ul.nav, ul.nav li {
    margin: 0;
    padding: 0;
    }
    
    ul.nav li {
    display: inline;
    list-style: none;
    background: none;
    }
    
    #navigation .nav a, #navigation .nav a:link, #navigation .nav a:visited {
    font-family: "Trebuchet MS", verdana, arial, helvetica, sans-serif;
            font-size: 1.2em;
    text-transform: uppercase;
    line-height: 2.5em;
    height: .3em;
    text-decoration: none;
    padding: 0 6px;
    background: none;
    color: #00457C;
    float: left;
    }
    
    #navigation .nav a:hover, #navigation .nav li a.selectedPage {
    background: #CF660A;
    }
    
    #extraCol .nav {
    display: block;
    background: #CF660A;
    padding: 1.9090em 0;
    }
    
    #extraCol .nav li a, #extraCol .nav li a:link, #extraCol .nav li a:visited {
    display: block;
    color: #F58426;
    border-bottom: 0.1818em solid;
    text-decoration: none;
    margin: 0.4545em 0 0.4545em 21px;
    padding: 0.4545em 0;
    font-weight: bold;
    }
    
    #extraCol .nav li a:hover, #extraCol .nav li a:active {
    color: #F58426;
    }
    
    #footer .nav a, #footer .nav a:link, #footer .nav a:visited {
    margin-right: 1em;
    text-transform: uppercase;
    }
    
    #footer .nav, #footer .nav li {
    margin-bottom: 0;
    }
    
    
    /* Headers
    --------------------------------------- */
    
    h2, h3, h4 {
    font-family: "Trebuchet MS", verdana, arial, helvetica, sans-serif;
    }
    
    h1 {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 2.1em;
        font-weight: normal;
    color: #663300;
    line-height: 1.37em;
    margin: 1.2em auto 0.5em;
    }
    
    h2, #extraCol h1 {
    font-size: 1.4em;
    line-height: 1.2em;
    color: #663300;
    margin: 1.1578em auto 0.5789em;
    font-weight: bold;
    }
    
    h3, #extraCol h2 {
    font-size: 1.2em;
    color: #663300;
    line-height: 1em;
    margin: 1.2em auto 0.6875em;
    font-weight: bold;
    }
    
    h4, #extraCol h3 {
    font-size: 1.2727em;
    line-height: 1.1785em;
    margin: 1.57174em auto 0.7857em;
    font-weight: bold;
    }
    
    h5, #extraCol h4 {
    font-family: verdana, arial, helvetica, sans-serif;
    color: #663300;
    line-height: 1.5em;
    font-weight: bold;
    }
    
    h6, #extraCol h5 {
    font-family: verdana, arial, helvetica, sans-serif;
    color: #663300;
    text-align: right;
    line-height: 1.5em;
    margin: 1.5em 0 0 0;
    font-style: italic;
    font-weight: bold;
    }
    
    #header h1, #header h2, #header h3, #header h4 {
    color: #663300;
    margin: 0.75em 0 0 0;
    padding: 0;
    }
    
    #header h1 {
    font-size: 3em;
    }
    
    .title {
    border-bottom: 0.1818em solid;
    padding-bottom: 0.1818em;
    }
    
    /* Content
    ------------------------------------- */
    
    #header p {
    margin-top: 0;
    }
    
    #header a, #header a:link, #header a:visited, #header a:hover, #header a:active {
    color: #FFF;
    text-decoration: none;
    }
    
    div.content {
    padding: 1.5em;
    }
    
    .eventsList ul, .linksModule ul, .blogList ul {
    margin-left: 0.75em;
    padding-left: 0;
    }
    
    .eventsList li, .linksModule li, .blogList li {
    list-style: none;
    padding-left: 18px;
    margin-left: 0;
    background: url(images/bullet.gif) no-repeat left 0.2727em;
    margin-bottom: 1em;
    }
    
    .blogList li  {
    background-image: url(images/news_bullet.gif);
    }
    
    .eventsList li {
    background-image: url(images/events_bullet.gif);
    }
    
    .linksModule li {
    background-image: url(images/links_bullet.gif);
    }
    
    .breadCrumb {
    border-bottom: 0.0909em dotted #E1DED0;
    padding: 1em 0;
    margin-bottom: 1em;
    }
    
    .button {
    border: 2px solid #C5C3B6;
    padding: 4px 8px;
    background: #FFF url(/Styles/images/waterButtons_tile.gif) repeat-x left -6px;
    clear: both;
    text-decoration: none;
    color: #6E6F71;
    font-weight: normal;
    font-family: verdana, arial, helvetica, sans-serif;
    font-size: 11px;
    display: block;
    width: auto;
    float: left;
    }
    
    div.comments dd.comment {
    padding: 1em 1.5em;
    background: #FAF8ED;
    }
    
    div.comments dt.comment {
    border-bottom: 4px double #E1DED0;
    padding: 1em 1.5em;
    background: #FAF8ED;
    }
    
    div.comments dd.alternate, div.comments dt.alternate {
    background: #F2F2EA;
    }
    
    .postDate {
    font-style: normal;
    font-size: 10px;
    color: #666;
    }
    
    .blogList .postInfo, .blogList .postDate {
    font-style: normal !important;
    font-size: 11px !important;
    color: #515151 !important;
    }
    
    .blogBack, .eventBack {
    border-top: 1px dotted #515151;
    background: #FAF8ED;
    padding: .5em 1.5em;
    margin-top: 1em;
    clear: both;
    }
    
    div.commentsForm input, div.commentsForm textarea {
    padding: .25em;
    font-size: 13px;
    width: 80%;
    }
    
    .blogList h2.postTitle {
    font-size: 100%;
    line-height: 1.5em;
    font-family: verdana, arial, helvetica, sans-serif;
    margin: 0;
    }
    
    div.commentsForm {
    padding: 11px 18px;
    border: 4px double #E1DED0;
    margin-top: 1em;
    background: #FAF8ED;
    }
    
    div.commentsForm h3.addComment {
    background: #E1DED0;
    color: #FFF;
    padding: 11px 18px;
    margin: -11px -18px 1em;
    }
    
    a.commentNumber, a.commentNumber:link, a.commentNumber:visited {
    text-indent: -9999px;
    background: url(images/comment_icon.gif) no-repeat left top;
    width:14px;
    height:15px;
    display: block;
    }
    
    h3.commentsHead {
    background: url(images/comment_icon.gif) no-repeat 4px 4px;
    padding-left: 24px;
    }
    
    /* Search
    --------------------------------------- */
    
    div.search {
    background: #E1DED0;
    padding: .5em 1.5em;
    }
    
    .searchInput {
    width: 95%;
    margin-bottom: 0.75em;
    padding: 0.1818em;
    font-size: 1.2727em;
    font-weight: bold;
    }
    
    .searchButton {
    background: #CF660A;
    color: #FFF;
    font-weight: bold;
    padding: 0.1818em;
    font-size: 1.2727em;
    margin-bottom: 1.5em;
    }
    
    div.search label {
    display: block;
    font-size: 1.4545em;
    line-height: 1.2em;
    margin: 1.375em auto 0.6875em;
    font-weight: bold;
    }
    
    /* Events Calendar
    --------------------------------------- */
    
    .eventsCalendar table {
    border: 1px solid #807d70;
    width: 100%;
    border-collapse: collapse;
    }
    
    .calendarDay, .calendarToday, .calendarDayHeader, .calendarTitle td, .calendarWeekendDay, .calendarOtherMonthDay   {
    padding: 2px;
    border: 1px solid #807d70;
    }
    
    .eventsCalendar table table, .eventsCalendar table table td {
    border: none;
    width: 100%;
    border-collapse: collapse;
    }
    
    .calendarTitle td {
    text-align: center;
    background: #515151;
    color: #FFF;
    font-weight: bold;
    padding: 6px 4px;
    }
    
    .calendarNextPrevious {
    font-weight: normal;
    }
    
    .calendarNextPrevious a {
    color: #CC660C !important;
    font-weight: normal;
    }
    
    .calendarToday, .calendarToday {
    color: #FFF;
    background: #CF660A;
    }
    
    .calendarDayHeader {
    color: #f2f2ea;
    background: #807d70;
    font-weight: bold;
    height: 1px;
    text-align: center;
    padding: 4px 2px;
    }
    
    .calendarWeekendDay {
    background: #f2f2ea;
    }
    
    .calendarOtherMonthDay {
    color: #807d70;
    background: #e1ded0;
    }
    
    /* Admin
    --------------------------------------- */
    
    .ajax__tab_default .ajax__tab_body {
    background: #f7f7f2 url(images/tab_body_tile.gif) repeat-x left bottom;
    }
    
    .ajax__tab_default .ajax__tab_header {
    border: none;
    background: url(images/single_line.gif) repeat-x left bottom;
    }
    
    .ajax__tab_default .ajax__tab_inner {
    
    }
    
    .ajax__tab_default .ajax__tab_outer {
    background: #e1ded0 url(images/tab_normal_tile.gif) repeat-x left top;
    padding: 0.4545em 1.0909em;
    margin-bottom: 0.0909em;
    }
    
    .ajax__tab_default .ajax__tab_active .ajax__tab_outer {
    background: #f7f7f2 url(images/tab_active_tile.gif) repeat-x left top;
    margin-bottom: 0;
    padding-bottom: 0.5454em;
    }
    
    .ajax__tab_default .ajax__tab_active span.ajax__tab_tab {
    font-weight: bold;
    border: none;
    padding-bottom: 0.0909em;
    }
    
    .ajax__tab_default .ajax__tab_hover .ajax__tab_tab {
    border: none;
    padding-bottom: 0.0909em;
    }
    
    div.helpContent {
    background: #ffffe1;
    color: #515151 !important;       
    }
    
    div.helpContent p {margin-bottom: 0;}
    
    .templateChooser {
    background: url(images/tab_body_tile.gif) repeat-x left bottom;
    border: 1px solid #e1ded0;
    }
    .ajax__tab_default .ajax__tab_body blockquote {
    
    }
    
    .actions img {vertical-align: middle;}
    
    
    /* Forms
    --------------------------------------- */
    
    .formHeader h2 {
    border-bottom: 0.1818em solid !important;
    padding-bottom: 0.1818em !important;
    font-size: 2em !important;
    line-height: 1.1em;
    margin: 1em auto 0.5em !important;
    font-weight: bold;
    }
    
    .fieldSelected {
    background: transparent !important;
    border: 4px dotted #CC660C !important;
    }
    
    .fieldError {
    color: #CC660C !important;
    background: transparent !important;
    border: 4px solid ##CC660C !important;
    }
    
    #errorSummary {
    color: #CC660C !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    }
    
    #MainContent_4_4_btnSubmit {
        color:#fff;
        background-color:#663300;
        border: fff;
        padding: .5em;
        font-family: "Trebuchet MS", verdana, arial, helvetica, sans-serif;
        font-weight: bold;       
            }
    
    /* Clearing
    --------------------------------------- */
    
    #container:after, #extraCol .nav:after, #frame:after, #footer:after {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }
    
    #container, #extraCol .nav, #frame, #footer {display: inline-block;}
    
    * html #container, * html #extraCol .nav, * html #frame, * html #footer {height: 1%;}
    #container, #extraCol .nav, #frame, #footer {display: block;}

    And here is the applicable HTML for the template of that page:

    Code:
    <body class="home">
    <div id="frame">
    <div id="header">
            <div id="navigation">
                <$rootmenu cssClass='nav'/$>
            </div>
            </div>
        <div id="middlebar">
    </div>
    <div id="container">
            <div id="subCol">
    <$region name='SubColumn'$>
    <$/region$>
    </div>
    <div id="mainCol">
    <$region name='MainContent'$>
    <$/region$>
    </div>
    <hr class="hide" />
    <div style="clear: both;">&nbsp;</div>
    </div>
    <div id="extraCol">
    <div class="content">
    <$region name='ExtraColumn'$><$/region$>
    </div>
        <p align="center">&copy;2007 Radiant Plumbing. Design by <a href="http://drawingonthepromises.com"><strong>dotp</strong></a></p>
    </div>
    <hr class="hide" />
    <div id="footer">
    </div>
    <div style="clear: both;"></div>
    </div>
    </body>
    </html>
    Thanks for the help.

  • #6
    New to the CF scene
    Join Date
    May 2005
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Found the issue

    Issue found and solved. Thanks for the help.


  •  

    Posting Permissions

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