Ian,

I believe the problem comes from the negative left margin. I am not sure on 
the technical reasoning behind it, but it appears that when a standards 
based browser like Firefox sees the large negative margin to the left, it 
doesn't deem it necessary to provide the ability to scroll there.

I would follow Micky's advice and center the wrapper the way he suggested.

Tim Kadlec


Message: 14
Date: Sat, 19 Aug 2006 01:07:05 +0100
From: Ian Piper <[EMAIL PROTECTED]>
Subject: [css-d] Horizontal scrollbars on a CSS-centred page
To: css-d css-d <[email protected]>
Message-ID: <[EMAIL PROTECTED]>
Content-Type: text/plain;       charset=US-ASCII;       delsp=yes;      
format=flowed

Hi all,

I've just had my attention drawn to a small problem with a site
(http://www.bbfcontracts.co.uk/). I made this site fixed width and
centred its pages using this piece of CSS:


#wrapper {
        width: 860px;
        position: relative;
        left: 50%;
        margin-left: -430px;
        border-left: 1px solid #333333;
        border-right: 1px solid #333333;
        border-bottom: 1px solid #333333;

}


However, someone has pointed out to me that the browser window
doesn't show a horizontal scrollbar (in Safari or IE) when the
browser window is narrow. In Firefox it does show a scrollbar but it
is not possible to scroll to the left edge of the page.

Where have I gone wrong with my CSS?


Ian.
--
Dr Ian M Piper
[EMAIL PROTECTED]
skype: ianmpiper
--
Where is the wisdom we have lost in knowledge?
Where is the knowledge we have lost in information?




------------------------------

Message: 15
Date: Fri, 18 Aug 2006 17:19:58 -0700
From: Micky Hulse <[EMAIL PROTECTED]>
Subject: Re: [css-d] Horizontal scrollbars on a CSS-centred page
To: css-d css-d <[email protected]>
Message-ID: <[EMAIL PROTECTED]>
Content-Type: text/plain; charset=ISO-8859-1; format=flowed

Ian Piper wrote:
>#wrapper {
>       width: 860px;
>       position: relative;
>       left: 50%;
>       margin-left: -430px;
>       border-left: 1px solid #333333;
>       border-right: 1px solid #333333;
>       border-bottom: 1px solid #333333;
>
>}

Hi,

I am probably not understanding the question or the problem(s)... but
why not use this to center your page:

body {
        margin: 0;
        padding: 0;
        text-align: center;
}
#wrapper {
        text-align: left;
        margin: 0 auto;
        border-width: 0 1px 1px 1px;
        border-style: solid;
        border-color: #333;
}

Sorry if I did not get your question... I am stupid sometimes.  :)


------------------------------

_________________________________________________________________
Express yourself instantly with MSN Messenger! Download today - it's FREE! 
http://messenger.msn.click-url.com/go/onm00200471ave/direct/01/

______________________________________________________________________
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