Side navigation
#8301 closed bug (worksforme)
Opened February 17, 2011 04:13PM UTC
Closed February 21, 2011 12:40AM UTC
Last modified February 21, 2011 11:52AM UTC
jQuery effects doesn't like css display table elements
Reported by: | samishiikihaku23@gmail.com | Owned by: | samishiikihaku23@gmail.com |
---|---|---|---|
Priority: | low | Milestone: | 1.next |
Component: | effects | Version: | 1.5 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
I have a series of divs layed out in my page:
+-+------+-+ The two sides are simply padding | | NAV | | +-+------+-+ | | BODY | | +-+------+-+
Using the css properties ''display:table'',''display:table-row'', and ''display:table-cell'' through the class property of my divs.
When I use jQuerys effects to fade out(general term not the function), append html to the BODY area, then fade back in, the content is now:
+-+------+------+ | | NAV | | +-+------+------+ | | | BODY | +-+------+------+
Also when I click it yet again, it does this:
+-+-----+-+ | | NAV | | +-+-----+-+ | | | | BODY +-+-----+-+
I couldn't get the jsFiddle to work right. So: http://hoa.ath.cx/~dm2/
Developer machine and home comp, so might run a little slow.
If you wanna see the result mentioned above, hover "Equipment", then click "Add"
Attachments (0)
Change History (8)
Changed February 17, 2011 04:18PM UTC by comment:1
Changed February 17, 2011 04:58PM UTC by comment:2
Also i'm using the effects on the actual table-cell element. I know I could simply put another div container into the table-cell div, but I don't know if this sort of behavior is intended or not.
Changed February 17, 2011 05:57PM UTC by comment:3
owner: | → samishiikihaku23@gmail.com |
---|---|
status: | new → pending |
The test case link is invalid. Please provide a valid test case demonstrating this issue.
Changed February 17, 2011 07:28PM UTC by comment:4
status: | pending → new |
---|
Heres a jsFiddle link to the problem. http://jsfiddle.net/kVJcm/3/
Granted its not really filled with my content anymore. But it still show cases what happens.
Changed February 19, 2011 06:20PM UTC by comment:5
It is extremely difficult for us to isolate or understand the problem you are having when the testcase is not reduced. It would be helpful if you could please reduce your test case as per the bug reporting guidelines.
Changed February 19, 2011 07:53PM UTC by comment:6
_comment0: | http://jsfiddle.net/samishii23/kVJcm/6/ \ Heres the "Reduced" test case you asked for. Sorry about that. \ I noticed something, that the div in which is being faded out and what not doesn't have the ''display: table-cell;'' style in it. Though that would explain why its messing up... But still. Should it still be doing what its doing? Isn't kinda weird to behave like that, even if its a missing declaring? I mean I know HTML isn't a very strict language... But just my opinion here. \ \ http://jsfiddle.net/samishii23/kVJcm/7/ \ This is a test case with the div having the ''display: table-cell;'' declaration and it works. Though, maybe my title should be edited to something like, "Weird behavior with improper css display: table-cell declaration" or somethin to that effect. → 1298145221335881 |
---|
http://jsfiddle.net/samishii23/kVJcm/6/
Heres the "Reduced" test case you asked for. Sorry about that.
I noticed something, that the div in which is being faded out and what not doesn't have the ''display: table-cell;'' style in it. Though that would explain why its messing up... But still. Should it still be doing what its doing? Isn't kinda weird to behave like that, even if its a missing declaring? I mean I know HTML isn't a very strict language... But just my opinion here.
http://jsfiddle.net/samishii23/kVJcm/7/
This is a test case with the div having the ''display: table-cell;'' declaration and it works. Though, maybe my title should be edited to something like, "Weird behavior with improper css display: table-cell declaration" or somethin to that effect.
(PS: mind switching "Ownership" to this account?)
Changed February 21, 2011 12:40AM UTC by comment:7
component: | unfiled → effects |
---|---|
priority: | undecided → low |
resolution: | → worksforme |
status: | new → closed |
Oh forgot to mention that I removed the append HTML to see if it was my HTML that was breaking the Table. As it stands, the example at the aboved mentioned URL is the one with out the HTML as it still show cases the bug just fine.