donum / curvycorners

Automatically exported from code.google.com/p/curvycorners
0 stars 0 forks source link

Div inside a div height bug #94

Open GoogleCodeExporter opened 9 years ago

GoogleCodeExporter commented 9 years ago
When i try to change an inside div's height after the page rendering, it 
overlaps the outer div.
It should stretch the outer div too.
It's very common to alter one divs content dynamicaly (ajax) so it's essential 
in my opinion to play well with that.
I think that it has to do with the absolute positioning of the curved div but 
my knowledge is limited to fix it myself

I've attached an example.
(Open the demo1.html)

Thanks and keep up the great work!
Dimitris

Original issue reported on code.google.com by dimitris...@gmail.com on 8 Oct 2010 at 10:54

Attachments:

GoogleCodeExporter commented 9 years ago
I am facing the same issue.
I have 2 <div> tags inside a curvy <div>

The issue is that once you apply javascript curvycorners to a <div> then you 
cannot set the internal <div> tags height in percentage.

Any info regarding a workaround to this would be of great help.

Best Regards,
Andrews 

Original comment by andrews....@gmail.com on 8 Apr 2011 at 11:51

GoogleCodeExporter commented 9 years ago
I am also facing same problem. Please help us workaround for this.

Thanks
Abdul

Original comment by abdulsk...@gmail.com on 13 Aug 2011 at 4:24

GoogleCodeExporter commented 9 years ago
Had the same problem. Only solution for me was to remove the curvy corners from 
the div and add it again.

function WriteInfoLayer(ID,sText) {
    //ID = ID of inner DIV
    //sTekst = content I want to add in div

    //Get the entire inner div as it is before the update.
    var cnt = $('#' + ID).parent().html();

    //Get the actual parent. of the inner div
    //I use parent twice because curvyConners adds an extra div.
    var prnt = $('#' + ID).parent().parent();

    //Clear the extra class used for curvyCorners.
    prnt.removeClass("curvyIgnore");
    //Clear the inline style. Its added by curvyCorners
    prnt.removeAttr('style');

    //add the original inner div to the parent again
    //the extra divs added by curvycorners are now removed
    prnt.html(cnt);

    //set the new content
    $('#' + ID).html(sText);

    //reapply curvycorners  
    applyCurvyCorners()
}

function applyCurvyCorners()
{
    var settings = {
    tl: { radius: 10 },
    tr: { radius: 10 },
    bl: { radius: 10 },
    br: { radius: 10 },
    antiAlias: true
    }
    curvyCorners(settings, ".myBox");
}

Original comment by drzi...@home.nl on 29 Nov 2011 at 8:58

GoogleCodeExporter commented 9 years ago
to chime in on this 'old' issue that I also came across; addressed it by 
setting the height of the first child DIV within the parent. This DIV is 
automatically created by curvycorners, but does not have an ID.

[code]
$j("div#parent").children(":first").height($j("div#internal").height());
[/code]

This line is called within the onSuccess handler of the AJAX call, after 
updating the content of "internal". The "parent" div is styled with the rounded 
borders.

Original comment by eddo.klo...@gmail.com on 20 Nov 2012 at 12:21