Results 1 to 3 of 3

Thread: Crossfader / CSS looks works in firefox but...

  1. #1
    Join Date
    Jul 2006
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Crossfader / CSS looks works in firefox but...

    Not in IE... crazy hu? The container in Firefox is positioned properly, but when viewed in IE, its shot out to the right about 200px; I gather this has something to do w/ relative positioning perhaps, but i can't see how to fix it.

    THE CODE:

    <tr>
    <td class="green_11" style="padding-right:7px; padding-top:20px; line-height:12px" valign="top" align="center">
    <span class="green_12"><b>LATEST<br />CASTING CALLS</b></span>

    <div class="cf_wrapper" style="margin-left:0; margin-top:-10px;">

    {foreach key=key name=calls item=feature from=$feature_call}<br />
    {if $smarty.foreach.calls.iteration == 1}
    <div class="cf_element" id="cf1">
    <div class="content">
    {elseif $smarty.foreach.calls.iteration == 4}
    <div class="cf_element" id="cf2">
    <div class="content">
    {elseif $smarty.foreach.calls.iteration == 7}
    <div class="cf_element" id="cf3">
    <div class="content">
    {/if}

    <b><a href="index.php?page=casting_call&block=details&call_id={$feature.id}"> {$feature.title}</a></b><br />
    <span class="green">{$feature.info}<br>
    <b><em>-{$feature.state}</em></b></span><br />

    {if $smarty.foreach.calls.iteration == 3}
    </div>
    </div>
    {elseif $smarty.foreach.calls.iteration == 6}
    </div>
    </div>
    {elseif $smarty.foreach.calls.iteration == 9}
    </div>
    </div>
    {/if}
    {/foreach}
    </div>

    </td>
    </tr>

    THE CSS


    div.cf_wrapper
    {
    position: relative;


    }

    div.cf_element
    {
    width: 130px;
    /*height: 230px;*/
    background-color: #eee;

    }

    div.cf_element div.content
    {
    padding: 10px;
    }

    div.cf_element div.content h3
    {
    padding-top: 0;
    margin-top: 0;
    }


    ---------------------------------------------

    If anyone out there has any ideas for me, i'd greatly appreciate it, i'm stuck!

    Thanks,

    TM

  2. #2
    Join Date
    Nov 2007
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi,

    I've had the same problem: Firefox vs IE.
    Part of your problem is the "padding" issue. Try using "cm" instead of "px" in:

    div.cf_element div.content
    {
    padding: 10px;
    }

    But you'll have to change the size number: 10px != 10cm. Try with lower values such as 1 or less, like 0.8.

    Hope to solve at least the padding!

  3. #3
    Join Date
    Jul 2006
    Location
    just north of Boston, MA
    Posts
    1,806
    Thanks
    13
    Thanked 72 Times in 72 Posts

    Default

    Quote Originally Posted by jmouta View Post
    Hi,

    I've had the same problem: Firefox vs IE.
    Part of your problem is the "padding" issue. Try using "cm" instead of "px" in:

    div.cf_element div.content
    {
    padding: 10px;
    }

    But you'll have to change the size number: 10px != 10cm. Try with lower values such as 1 or less, like 0.8.

    Hope to solve at least the padding!
    noooooooooooo, cm still uses a non-browser based standardization.

    I would recommend em's, which are based upon the rendering of an average lower-cased M character as the browser renders it.

Bookmarks

Posting Permissions

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