Hey Franky, yeh i was looking at my favorate liquid corner tutorial that i had saved on my computer long time ago, and lone behold it is the website you sent. The 2nd link i posted in my 1st email is based on that kinda with the negative margins... but I cannot add margins like that tutorial suggests to let the rounded corners bleed through because the layout kinda breaks.
For example add, margin:0px 21px; to #containerTop1 and #containerBottom1 on http://arihoj.freehostia.com/rsfc/rsfc_negMargins.html notice it bleeds through, but the background-image moved so you have to adjust #body1 Then try to make #body1, match that with margin:0px 21px;. and it doesnt work out. On 9/20/06, Arian Hojat <[EMAIL PROTECTED]> wrote: > > Hey franky, > When you say "I guess all problems will melt if you make two distinct > corners constructions: 1 for the left box, 1 for the right box.". > If i do that though, I lose the faux columns. So I have to set that > repeating middle image on the parent of those 2 left/right floats or it wont > know how far to repeat it. > > Sorry your website is being blocked at my work :), i guess cause it has > the word 'home.' in it. I will check out later or ask them to unblock it. I > have a feeling it is a rounded corner method, but doesnt take into account > making Faux Columns. > > > Arian > > > On 9/20/06, francky <[EMAIL PROTECTED]> wrote: > > > > Arian Hojat wrote: > > > > >Hello Everyone, > > > > > >I spent the night tonight trying to make Sliding Faux Columns but with > > >rounded edges at top and bottom of the columns. Also I wanted it so > > >the layout can lay on top of a gradient background where the gradient > > >will 'bleed through' the transparent areas of the rounded corners. > > > > > >This is what I came up with. > > >http://arihoj.freehostia.com/rsfc/rsfc.html > > >I thought it was decent for a 1st time effort. Its supposed to be a > > >mockup of one of Adobe's layout... > > >http://labs.adobe.com/technologies/flash9as3preview/ > > > > > >Had a question though... > > >Id like to make it so I dont use padding to achieve the > > >background-image layout, at least in the middle #body3 area where my > > >content is. > > >For example, look at how the bottom borders of the list in the right > > >sidebar dont extend all the way to the right. It is because padding is > > >used on its parent to push the background-images into place without > > >them overlapping and hiding each other. > > > > > >My 1st idea was to get rid of the left and right padding of 21px in > > >the #body2 rule, and somehow configure rest of layout to also not use > > >padding... But seems like it ruins the layout. > > > > > >Another idea is maybe move all the top and bottom areas to a 'negative > > >margin' rounded corner method, so no padding is necessary anywhere, I > > >think id prefer this method... > > >But as you can see it doesn't bleed through the corner images anymore. > > > http://arihoj.freehostia.com/rsfc/rsfc_negMargins.html > > > > > > > > >Any ideas? > > > > > >Thanks in advance, > > >Arian > > > > > > > > Hi Arian, > > Now the corners construction (top and bottom) consists of 3 parts: the > > middle part has the right corner of the left box and the left corner of > > the right box. Then if something is arranged in another way in the 2 > > content boxes, the images have to be adapted: the middle image is > > serving 2 containers! > > > > I guess all problems will melt if you make two distinct corners > > constructions: 1 for the left box, 1 for the right box. Then you can do > > with the boxes whatever you want, and the corners wil stick to the box > > in question. > > > > This can be realized with only 2 images (1 for the left box corners > > together, and 1 for the right box corners together). > > In the css you can use almost the same styles for the left and right > > box: just give an extra class or id to get the right background corners. > > > > > > A small "example suite" is here > > <http://home.tiscali.nl/developerscorner/liquidcorners/more-rounded-corners_step1.htm > > >. > > Everything is liquid and adaptable! :-) > > For the background of the method and for more Xamples you can read: > > article and playgarden Liquid Round Corners > > <http://home.tiscali.nl/developerscorner/liquidcorners/liquidcorners.htm > > >. > > > > Greetings, > > francky > > > > ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
