abrupt transition: http://jsbin.com/aposu in that, the way the div is hidden, abruptly, is what I am seeing in my application. the showing of the div seems to be fine in this link though. Only the hiding of the div is abrupt and thats what I see in both hiding AND showing of MY comms div.
On Thu, Apr 23, 2009 at 1:07 PM, Mona Remlawi <[email protected]>wrote: > > ok time for jsbin > i created 2 pages > abrupt transition: http://jsbin.com/aposu > smooth transition: clearfix applied: http://jsbin.com/ugiju > > test and see if we are talking about same abnormal behaviour > > cheers > > -- > mona > [email protected] > > On Thu, Apr 23, 2009 at 9:13 AM, Vinay Seshadri > <[email protected]> wrote: > > I DO have that in my main stylesheet Mona.. > > and I have .clearfix {overflow:auto} within style tags in my html layout > > page. here's exactly what i have now.. > > main.css > > .clearfix:after > > { > > content:"."; > > display:block; > > height:0; > > clear:both; > > visibility:hidden; > > } > > .form { > > padding: 1em; > > border: 0px; > > font: 90% "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; > > background: #F4FECA; > > } > > .gform { > > width : 810px; > > line-height: 20px; > > margin: 0 auto; > > } > > main.html.erb (layout page) > > (within head tags) > > <style type="text/css"> > > .clearfix {zoom: 1; /* triggers hasLayout */ } > > </style> > > and the comments partial > > <div class="form clearfix" style="display:none" id="comments-section"> > > ... > > ... > > everything else is the same as before. > > is it definitely the unfixed height causing this? it definitely sounds > like > > a plausible cause though. > > On Thu, Apr 23, 2009 at 12:22 PM, Mona Remlawi <[email protected]> > > wrote: > >> > >> hey Ram, you mentioned that you are testing on Safari and FF. > >> so you need to include this rule > >> .clearfix:after > >> {content:".";display:block;height:0;clear:both;visibility:hidden;} > >> in your style block. > >> > >> .clearfix {overflow:auto} > >> is required for IE support. > >> > >> http://www.google.com/search?q=clearing+floats > >> > >> > >> cheers > >> > >> -- > >> mona > >> [email protected] > >> > >> On Thu, Apr 23, 2009 at 7:39 AM, Ram <[email protected]> > wrote: > >> > > >> > Hi Walter, > >> > > >> > Thanks for pointing me to the right resources. Im reading up on it > >> > here http://www.communitymx.com/content/article.cfm?page=2&cid=c37E0. > >> > > >> > It still doesnt fix my problem though. I tried overflow:auto instead > >> > of zoom:1 and the only difference was the I got a vertical scroll bar > >> > inside the comms div this time. But the div still just gets displayed > >> > and then hidden abruptly without the effect. > >> > > >> > Any idea? > >> > > >> > On Apr 22, 10:06 pm, Walter Lee Davis <[email protected]> wrote: > >> >> Windows IE doesn't properly set floated elements to occupy design > >> >> space unless you set a value for the height or width, or you use one > >> >> of several different hacks to get it to trigger its internal property > >> >> "hasLayout". > >> >> > >> >> .clearfix { > >> >> overflow: auto; > >> >> > >> >> } > >> >> > >> >> or > >> >> > >> >> <!--[if IE]> > >> >> <style type="text/css"> > >> >> .clearfix { > >> >> zoom: 1;} > >> >> > >> >> </style> > >> >> <![endif]--> > >> >> > >> >> Either one of these will work, and there are others. Google the Holly > >> >> Hack, or just > >> >> readhttp://positioniseverything.netorhttp://quirksmode.org > >> >> > >> >> Within IE, an object with hasLayout = true can be manipulated by the > >> >> animation engine, but one that does not appears (to IE) to occupy no > >> >> space; therefore making it shrink and grow is something of an issue, > >> >> since there's no existing dimension to work from. You could simply > >> >> give this object fixed dimensions, then it's trivial to make it > shrink > >> >> and grow. But then standards-compliant browsers will clip off the > >> >> content (or cause it to overflow its box) when they reach that size, > >> >> and fail to respond to text-size changes as gracefully as they might > >> >> otherwise. > >> >> > >> >> Walter > >> >> > >> >> On Apr 22, 2009, at 12:32 PM, Ram wrote: > >> >> > >> >> > Dint really understand what you guys meant. Can you be a bit more > >> >> > explanatory? > >> >> > Thanks for your responses! > >> >> > On Apr 22, 7:24 pm, Walter Lee Davis <[email protected]> wrote: > >> >> >> You can also set overflow:auto to the same effect, and you don't > >> >> >> have > >> >> >> to hide it from other browsers, either. > >> >> > >> >> >> Walter > >> >> > >> >> >> On Apr 22, 2009, at 10:17 AM, Mona Remlawi wrote: > >> >> > >> >> >>> .clearfix {zoom: 1; /* triggers hasLayout */ } > >> > > > >> > > >> > >> > > > > > > > > -- > > In Sport We Trust !!! > > > > > > > > > > > -- In Sport We Trust !!! --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~----------~----~----~----~------~----~------~--~---
