What you have to remember to do is subtract any margins, padding, and borders
you have defined for
that element. For instance...
<div id="one"> </div>
div#one {
width:300px;
background-color:#FF0000;
}
... displays a div that's 300px wide. But if you want to pad it's contents you
need to subtract
the padding (minus 10 for the left and then minus 10 for the right for a total
of 20px)...
<div id="one"> </div>
div#one {
width:280px;
padding:10px;
background-color:#FF0000;
}
... the same goes if you add borders...
<div id="one"> </div>
div#one {
width:278px;
padding:10px;
border:1px solid #000000;
background-color:#FF0000;
}
----- Original Message -----
From: Joseph R. B. Taylor
To: <wsg@webstandardsgroup.org>
Sent: Tue, 15 Nov 2005 10:05:24 -0500
Subject: Re: [WSG] Help with menu
I'm not sure...about a physical reference but here's an example:
http://sitesbyjoe.com/box_examples.htm
It seems to work flawlessly, and its simplicity makes me feel good about
using this approach. It also frees me from having to stick hacks in to
try and please the browsers.
Joe Taylor
http://sitesbyjoe.com
James O'Neill wrote:
> Joseph: Interesting. Do you have something that I can reference for this?
>
> Thierry: I will take a look at that tonight.
>
> Thanks guys!
>
> On 11/15/05, * Joseph R. B. Taylor* < [EMAIL PROTECTED]
> <mailto:[EMAIL PROTECTED]>> wrote:
>
> As a reminder, at this point you cannot safely apply widths to any
> elements that have a border, padding or a margin. In the case you
> need
> to apply width adn one of the others mentioned, safest best is to
> insert
> a nested div/span with the padding applied etc to break it up.
>
> This has long since been a point of confusion for many people, and
> this
> simple remedy (although in the long term not the best) proves most
> effective with todays browsers.
>
> Joe Taylor
> http://sitesbyjoe.com
>
> Thierry Koblentz wrote:
>
> >James O'Neill wrote:
> >
> >
> >>I am having problems with a menu that is similar to the Alistapart's
> >>hybrid menu. I can not get the width to be consistantly even
> with the
> >>rest of the site and it is not workig in IE or Opera. It works fine
> >>in Firebird. I have been beating my head against this for quite a
> >>long time.
> >>
> >>It seems that absolutely positioned widths do not behave as I
> expect
> >>them. Oi!
> >>
> >>http://twitch.sharkpork.com/_work/Freedom/
> >>
> >>"Help me Obi-wan you are my only hope"
> >>
> >>
> >
> >Did you give this one a try?
> >http://www.tjkdesign.com/articles/dropdown/demo.asp
> <http://www.tjkdesign.com/articles/dropdown/demo.asp>
> >It is a bit moe accessible.
> >
> >Thierry | www.TJKDesign.com <http://www.TJKDesign.com>
> >
> >******************************************************
> >The discussion list for http://webstandardsgroup.org/
> <http://webstandardsgroup.org/>
> >
> > See http://webstandardsgroup.org/mail/guidelines.cfm
> > for some hints on posting to the list & getting help
> >******************************************************
> >
> >
> >
> >
> ******************************************************
> The discussion list for http://webstandardsgroup.org/
>
> See http://webstandardsgroup.org/mail/guidelines.cfm
> for some hints on posting to the list & getting help
> ******************************************************
>
>
>
>
> --
> ______________________________________
> "Bugs are, by definition, necessary.
> Just ask Microsoft!"
>
> www.co.sauk.wi.us <http://www.co.sauk.wi.us> (Work)
> www.arionshome.com <http://www.arionshome.com> (Personal)
> www.freexenon.com <http://www.freexenon.com> (Consulting)
> ______________________________________
> Take Back the Web with Mozilla Fire Fox
> http://www.getfirefox.com
>
> Making a Commercial Case for Adopting Web Standards
> http://www.maccaws.org/ <http://www.maccaws.org/>
>
> Web Standards Project
> http://www.webstandards.org/
>
> Web Standards Group
> http://www.webstandardsgroup.org/
>
> Guild of Accessible Web Designers
> http://www.gawds.org/
******************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
