Page 1 of 2 12 LastLast
Results 1 to 10 of 13

Thread: firefox ignores float on <span> element

  1. #1
    Join Date
    Jan 2008
    Posts
    73
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default firefox ignores float on <span> element

    ignore this,ive changed the code,scroll down.

    http://www.kobital.co.il/v6/inside.htm

    if you click on the left square you get a list
    on ie7 it works ok the span for english floats to the left and the other lang[hebrew] floats to the right.
    but on firefox they stick together.

    any ideas?
    i've tried adding display:block and few more things
    the only solution i found was adding a padding-but i cant do it cause the names will be loaded dynamiclly
    Last edited by genia; 11-02-2008 at 03:02 PM.

  2. #2
    Join Date
    Mar 2007
    Location
    Currently: New York/Philadelphia
    Posts
    2,735
    Thanks
    3
    Thanked 519 Times in 507 Posts

    Default

    What did you put display:block on? You need it on your list items. The float is actually working. The problem is that your list items are only as wide as the the English and Hebrew parts.

    So your options are to either use display:block on the <li> elements. That'll work as long as you're not resizing the <ul> at all. If you are or if the above doesn't work, manually set the <li>'s width to the size of the square (minus and padding you want).

    Nicely designed site, by the way.

  3. The Following User Says Thank You to Medyman For This Useful Post:

    genia (11-02-2008)

  4. #3
    Join Date
    Jan 2008
    Posts
    73
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default

    thank you for your replay
    evntually i solved the problem by using <p> and <span>
    as you can see here:
    http://www.kobital.co.il/v7/inside.htm
    by clicking on "private projects"
    but now i have a new problem,now firefox ignores the a:hover rule
    inside "private projects".
    in IE it works fine but my fav. FF ignores it, i've tried adding hover to the span and <P> too but then it highlights only half row i cant make it highlight both the elements of the link

    any ideas on it?

  5. #4
    Join Date
    Oct 2008
    Location
    Sweden
    Posts
    2,023
    Thanks
    17
    Thanked 319 Times in 318 Posts
    Blog Entries
    3

    Wink

    I just put it in a table, works fine:
    Code:
    <div id="ppr_c" style="display: block;">
            <table cellpadding="0" cellspacing="0" border="0">
              <tr>
                <td class="hover"><a href="javascript:;" onmousedown="toggleDiv('mydiv');">
                  <p id="eng">English</p>
                  <span id="heb">עברית</span></a></td>
              </tr>
              <tr>
                <td><div id="mydiv" style="display: none;">text text text</div></td>
              </tr>
              <tr>
                <td class="hover"><a href="javascript:;" onmousedown="toggleDiv('genia');">
                  <p id="eng">English</p>
                  <span id="heb">עברית</span></a></td>
              </tr>
              <tr>
                <td><div id="genia" style="display: none;">Genia Genia Genia</div></td>
              </tr>
            </table>
          </div>
    Code:
    p {
    	margin:0;
    	padding:0;
    }
    .hover:hover {
    	background-color:#989D99;
    }
    #ppr_c #eng {
    	margin:0;
    	padding-left:8px;
    	float:left;
    	color:#fff;
    	width:67px;
    	display:inline;
    	font-family:arial;
    	font-size:9pt;
    	text-decoration: none;
    }
    Eddy Proca
    I love Dropbox. Get it through my girlfriend's referral link (I reached my limit) and both you and her get 500 MB extra! Thanks and you're welcome!

  6. #5
    Join Date
    Jan 2008
    Posts
    73
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default

    It does works..thanks
    but amm with no offense,maybe someone have a css solution?
    it's kind interesting why it ignores the <A>

  7. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,028
    Thanks
    44
    Thanked 3,210 Times in 3,172 Posts
    Blog Entries
    12

    Default

    This works in FF:

    Code:
    li {
    	color: #fff;
    	float: left;
    	width: 100%;
    	margin-left: -26px;
    	}
    Use it in place of your existing definition. If it messes up IE, use a conditional comment style afterwards (hopefully you know how to do this, if not just ask) to override it for IE.

    You may want to express the -26px in ems.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  8. The Following User Says Thank You to jscheuer1 For This Useful Post:

    genia (11-02-2008)

  9. #7
    Join Date
    Jan 2008
    Posts
    73
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default

    thanks but it's irelvant i've changed the code as you can see here:
    http://www.kobital.co.il/v7/inside.htm

    and iv'e got a little problem with it as you can see above^

  10. #8
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,028
    Thanks
    44
    Thanked 3,210 Times in 3,172 Posts
    Blog Entries
    12

    Default

    Code:
    <div style="width: 25px; height: 5px; margin-top: -30px; margin-left: 80px;">
    <a onmouseover="scrollContent('textslider',-1)" onmouseout="cancelScroll('textslider')"><img src="images/up.gif"></a> 
    <a onmouseover="scrollContent('textslider',1)" onmouseout="cancelScroll('textslider')" style="display: inline;"><img src="images/down.gif"></a>
    </div>
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  11. #9
    Join Date
    Jan 2008
    Posts
    73
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Default

    dude,thanks but that's not my problem.
    the problem is that when you click on "privte projects" and you get the list of the projects, firefox doesnt highlight the line but ie does.
    and i want to findout why

  12. #10
    Join Date
    Oct 2008
    Location
    Sweden
    Posts
    2,023
    Thanks
    17
    Thanked 319 Times in 318 Posts
    Blog Entries
    3

    Question

    I thought the table worked?
    Eddy Proca
    I love Dropbox. Get it through my girlfriend's referral link (I reached my limit) and both you and her get 500 MB extra! Thanks and you're welcome!

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
  •