Here is the page:
http://dardel.info/museum/Museum1.html

and here is the CSS (see navigation buttons at bottom of file):
http://dardel.info/museum/style3.css

Is there a way to make all nav buttons (at the bottom of the page) the
same width?

Thanks in advance for any hints

On 2008-03-15, François de Dardel <dardelf14@noos14.fr> wrote:
> Here is the page:
> http://dardel.info/museum/Museum1.html
>
> and here is the CSS (see navigation buttons at bottom of file):
> http://dardel.info/museum/style3.css
>
> Is there a way to make all nav buttons (at the bottom of the page) the
> same width?

Yes, but not without some caveats.

At the moment the list-items are display: inline to make them sit next
to each other the line.

But that means you can't set widths on them (because width doesn't apply
to things that are display: inline).

There are three other ways to make things line up next to each other
like that:

1. Float them
2. Make them display: inline-block
3. Use a table.

You can set widths on floats, inline-blocks or table cells.

But you can't centre floats, and inline-block doesn't work in Firefox
until version 3.

So that leaves a table, which won't make you any friends, but then you
seem to have already used tables quite a bit anyway so probably don't
care.

Option 4 is do nothing-- I think the buttons look fine the way they are
with different widths.

On 2008-03-15 17:34:21 +0100, Ben C <spamspam@spam.eggs> said:

> On 2008-03-15, François de Dardel <dardelf14@noos14.fr> wrote:
>> Here is the page:
>> http://dardel.info/museum/Museum1.html
>>
>> and here is the CSS (see navigation buttons at bottom of file):
>> http://dardel.info/museum/style3.css
>>
>> Is there a way to make all nav buttons (at the bottom of the page) the
>> same width?
>
> Yes, but not without some caveats.
>
> At the moment the list-items are display: inline to make them sit next
> to each other the line.
>
> But that means you can't set widths on them (because width doesn't apply
> to things that are display: inline).
>
> There are three other ways to make things line up next to each other
> like that:
>
> 1. Float them
> 2. Make them display: inline-block
> 3. Use a table.
>
> You can set widths on floats, inline-blocks or table cells.
>
> But you can't centre floats, and inline-block doesn't work in Firefox
> until version 3.
>
> So that leaves a table, which won't make you any friends, but then you
> seem to have already used tables quite a bit anyway so probably don't
> care.
>
> Option 4 is do nothing-- I think the buttons look fine the way they are
> with different widths.

Thank you Ben for your precise and informative reply. I will take option 4.

--
http://dardel.info/
Remove both fourteens in your direct replies
Enlever les deux quatorze pour m'écrire

François de Dardel wrote:
> On 2008-03-15 17:34:21 +0100, Ben C <spamspam@spam.eggs> said:
>

>> Option 4 is do nothing-- I think the buttons look fine the way they are
>> with different widths.
>
> Thank you Ben for your precise and informative reply. I will take option 4.
>

Also the easiest to implement!

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com