Thanks again Francky,

I didn't even think the images were too small! I will look further at your
example soon, but have to move on.

The extra mark-up in the CSS file are for other pages. All pages will have a
menu bar, header and border surrounding the content. The content will either
be split further by using some more of the positioning or like the two
examples so far, just a simple div or two. If you have a look at some of the
other pages on the site (all table based, none of which I coded!) you will
see some of the structures I've started coding the CSS for.

However, the bottom of the two pages so far are still a mess, I cannot use a
single image (customer says so) for the shop div so I tried setting one as a
background image shifted left and the img in the div floated right. However,
the right-hand edge gets pushed out and the background image does not show
at all!

Finally, I have to get the pages working in IE, the customer couldn't give a
damn about standards, they use IE and believe that every one but a few do
(98.6% of all visitors to their site!). But I want to understand the reasons
there are differences and try and make them work in all browsers, even at
the expense of a little more effort.

Regards
Pete 

-----Original Message-----
From: francky [mailto:[EMAIL PROTECTED] 
Sent: 15 August 2006 04:44
To: [EMAIL PROTECTED]
Cc: [email protected]
Subject: Re: [css-d] Sliding door rounded corner boxes

Pete Home wrote:

>I'm getting so frustrated with this. 
>
>I'm assuming that certain TAGs break the flow within this technique 
>therefore interrupting the image outlines causing what looks like 
>breaks in the border for instance.
>
>My site is very standard in layout with basically a top menu, header, 
>content and footer (see www.cityboxer.com/gambling/betting.htm). I want 
>the content to always have a rounded corner border. Francky fixed the 
>problems in FF with this page, so I then replaced the content with a 
>form and saved it as 
>www.cityboxer.com/newsite/contact/contact_form/register_form1.htm) and it
all goes wrong again.
>
>Has anyone used this technique as a template for many other sorts of pages?
>
>Regards
>Pete
>  
>
Aha! Don't give up! Assumption wrong...
I took some screen shots, and yes:

    * the corner box has a height of 765px (in resolution 1024x768,
      font-size normal in FF),
    * the box_bottomleft.gif and box_bottomright.gif are 700px in height,
    * we can see a gap of  65px at the top (for the images are
      positioned at the bottom of the div).
    * ;-)

Can be solved in 2 ways:

   1. extending the images in height, for the method is based upon
      images as high as the max. box you need.
   2. using repeated-y images of 1px height for the left and right
      borders (and appropriate css).

This is exactly the reason why I prefer the method 2 template: always
self-adapting, no worry about a new page which can have more height as the
page you developed the "big images" for, - which appear to be not big
enough.
As I said 13-08 (or 08-13):

>> "O, the box is breaking also at large font sizes. I guess because of not
enough height of the box_bottomleft.gif and box_bottomright.gif."

Method 2 is used in my earlier testpage c
<http://home.tiscali.nl/developerscorner/css-discuss/test-betting-c.htm>.
I used that page (exactly the the same css) to paste a long "form" in
it: testpage d
<http://home.tiscali.nl/developerscorner/css-discuss/test-betting-d.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/

Reply via email to