ansaurus

Question

Answer 1

+1 A:

I can't reproduce the problem. Please provide some code. This works as expected:

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
<html xml:lang="en-us" xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <title>Test</title>
  <link rel="stylesheet" href="style.css" type="text/css" media="screen" />
  <script src="assets/js/jquery-1.4.1.min.js" type="text/javascript"></script>
  <script src="assets/js/application.js" type="text/javascript"></script>
</head>
<body>
  <div id="test">
    <div>test</div>
    <div>test</div>
    <div>test</div>
    <div>test</div>
  </div>
</body>
</html>

CSS

#test div { width: 200px; height: 200px; float: left; outline: 1px solid #000; }

JS

$(function(){
  $('#test').hide();
  $(window).click(function(){
    $('#test').slideDown();
  });
});

Fred Bergman 2010-06-18 17:36:07

hmmm...you're right! There must be another variable I'm missing...I'll keep digging

DA 2010-06-18 17:49:19

@Fred...I tried all sorts of variations but couldn't replicate it from scratch. I finally copied the issue site elements verbatim and THEN the problem came back. So it's some odd combo of my particular CSS. I added a link to the sample in my original post.

DA 2010-06-19 02:01:52

Answer 2

+1 A:

solved:

remove margin-bottom:10px; from your

  .itemsWrapper {
    margin-bottom:10px;
    overflow:auto;
    width:100%;
    background: green;
  }

http://jsbin.com/ajoka/11

Starx 2010-06-19 02:37:41

That does fix the demo! Alas, not our specific markup. Ugh. Too many factors! In my case, I discovered that removing 'positon: relative' from the floated items fixes the problem. The issue is that they HAVE to be positioned relative in certain cases (when their contents is being positioned absolutely). Back to the testing board...

DA 2010-06-19 03:25:13

@Da, Why don't you post your entire code, I will take a look at it.

Starx 2010-06-19 09:17:36

ansaurus

tags:

views:

answers:

jQuery SlideDown and Float issuse

related questions