473,385 Members | 1,587 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,385 software developers and data experts.

<li>'s in navbar

On this page http://www.xs4all.nl/~hogen/MvK_nieuw/
I have a horizontal menu made up of an ul (bit scary, this, feel much more
comfortable with a table there, but I keep reading I should use css instead
;-))

Two questions:
the containing navbar div has a width of 760px.
There are 6 buttons of 116 wide plus a 1px border makes: 6 x 118px = 708px.
The buttons also have a 4px padding on the right, so I come to a total of
708px + 24px = 732 px. So where are my other 28px gone?

Do tell me I cannot add up!

I couldn't care less, really, my buttons not adding up, but I also want to
solve the problem of the most right hand button not being aligned properly.
I have tried to give that <li> it's own ID with it's own style, but
obviously not in the right way, for it had no effect what so ever.

If some one could help me, I would be very grateful.
--
Groet,
Adriana
[throw rubbish out if you want to reach me by e-mail]
Jul 21 '05 #1
11 1981
"A.Translator" <tr*************@yaBISHhoo.com> wrote:
On this page http://www.xs4all.nl/~hogen/MvK_nieuw/
I have a horizontal menu made up of an ul (bit scary, this, feel much more
comfortable with a table there, but I keep reading I should use css instead
;-))

Two questions:
the containing navbar div has a width of 760px.
Oh dear. What if my browser window isn't 760px wide?
There are 6 buttons of 116 wide
Have you looked to see what happens when the user increases the font
size? (You'll need to use a proper browser as Win IE won't resize your
pixel sized text - so the user who needs larger text can't read you
nav and will just leave your site.)
plus a 1px border makes: 6 x 118px = 708px.
The buttons also have a 4px padding on the right, so I come to a total of
708px + 24px = 732 px. So where are my other 28px gone?
padding: 2px 4px 2px 0;
margin: 2px 4px 2px 0;

So there's also 24px of margin to account for. The last 4px are left
over and create the extra gap on the right hand side (which does
indeed seem to be about twice as big as the gap between items).

All the above assumes a sensible browser. IE5 will plop the border and
padding inside the 116px so there will be a lot more space left over
on the right hand side.
I couldn't care less, really, my buttons not adding up, but I also want to
solve the problem of the most right hand button not being aligned properly.
I have tried to give that <li> it's own ID with it's own style, but
obviously not in the right way, for it had no effect what so ever.


Any style rule you use to style the rightmost button has to be more
specific than the rule #navbar ul li a,
so #navbar ul li a#foo would work but just #foo wouldn't. Beyond that
it depends on what you're trying to do.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>
Jul 21 '05 #2
On Thu, 24 Feb 2005 09:25:31 +0000, Steve Pugh wrote:
So there's also 24px of margin to account for. The last 4px are left
over and create the extra gap on the right hand side (which does
indeed seem to be about twice as big as the gap between items).
Stupid of me, not taking the margin into account. Thanks.
Any style rule you use to style the rightmost button has to be more
specific than the rule #navbar ul li a, so #navbar ul li a#foo would
work but just #foo wouldn't. Beyond that it depends on what you're
trying to do.


Thank you, I tried that, but will try again.

I'll have a look at the font-size too. I am in the early stages of
redesigning an old site and concentrating on the navbar for now.

--
Groet,
Adriana
[throw rubbish out if you want to reach me by e-mail]
Jul 21 '05 #3
On Thu, 24 Feb 2005 09:25:31 +0000 Steve Pugh wrote:
"A.Translator" <tr*************@yaBISHhoo.com> wrote:
On this page http://www.xs4all.nl/~hogen/MvK_nieuw/
I have a horizontal menu made up of an ul (bit scary, this, feel much
more
comfortable with a table there, but I keep reading I should use css
instead
;-)) Two questions:
the containing navbar div has a width of 760px.

Oh dear. What if my browser window isn't 760px wide?


You always have to bitch and whine about damn width issues.
Oh dear, what if I'm using a PDA or a cell phone?
760<800. True or false?
Jul 21 '05 #4
On Thu, 24 Feb 2005 10:08:17 +0100 A.Translator wrote:
On this page http://www.xs4all.nl/~hogen/MvK_nieuw/
I have a horizontal menu made up of an ul (bit scary, this, feel much
more
comfortable with a table there, but I keep reading I should use css
instead
;-))


You could start off by using colors that make the text VISIBLE!
Jul 21 '05 #5
On Thu, 24 Feb 2005 13:28:50 -0600, Richard wrote:
ou could start off by using colors that make the text VISIBLE!


excuse me?
--
Groet,
Adriana
[throw rubbish out if you want to reach me by e-mail]
Jul 21 '05 #6
Richard wrote:
You always have to bitch and whine about damn width issues.
Oh dear, what if I'm using a PDA or a cell phone?
760<800. True or false?


You're about to get plonked, true or false?

(hint: *plonk*)
--
Brian
Jul 21 '05 #7
"Richard" <An*******@127.001> wrote:
You always have to bitch and whine about damn width issues.


You always bitch and whine about my posts.
But I can build web sites and you can't so we'll just leave it at
that..

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>
Jul 21 '05 #8
On Thu, 24 Feb 2005 21:09:00 +0100 A.Translator wrote:
On Thu, 24 Feb 2005 13:28:50 -0600, Richard wrote:
ou could start off by using colors that make the text VISIBLE!

excuse me?


Any item which is to be seen and read, needs to be done with colors that do
not blend in with each other.
I could only tell that there was something in the grey boxes but had no idea
what.
The grey should be at least a very light grey. Then the text within the box
will show up.
Jul 21 '05 #9
On Thu, 24 Feb 2005 20:04:55 -0600, Richard wrote:
The grey should be at least a very light grey. Then the text within the box
will show up.


thank you.
--
Groet,
Adriana
[throw rubbish out if you want to reach me by e-mail]
Jul 21 '05 #10
PJ
I concur. I have what's known as a red/green defeciency...basically many
shades of red and green appear darker to me than most people and, because of
that, it's often very difficult to discern any contrast with other dark
colors or even black.

"Richard" <An*******@127.001> wrote in message
news:cv********@news2.newsguy.com...
On Thu, 24 Feb 2005 21:09:00 +0100 A.Translator wrote:
On Thu, 24 Feb 2005 13:28:50 -0600, Richard wrote:
ou could start off by using colors that make the text VISIBLE!

excuse me?


Any item which is to be seen and read, needs to be done with colors that

do not blend in with each other.
I could only tell that there was something in the grey boxes but had no idea what.
The grey should be at least a very light grey. Then the text within the box will show up.

Jul 21 '05 #11
On Fri, 25 Feb 2005 14:03:40 -0800, PJ wrote:
I concur. I have what's known as a red/green defeciency...basically many
shades of red and green appear darker to me than most people and, because of
that, it's often very difficult to discern any contrast with other dark
colors or even black.


Thank you for pointing that out.

--
Groet,
Adriana
[throw rubbish out if you want to reach me by e-mail]
Jul 21 '05 #12

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

3
by: Kelvin | last post by:
Basically, my texts consists of normal text stream and some quotations. This is my text stream, and inside "this streams" there are some "quotation pairs" which are to be replaced like this:...
8
by: Michael | last post by:
This is a two-part question to which I haven't been able to find an answer anywhere else. 1. Is it possible to format the bullet/number character of the <li>? In my styles sheet, I have the <li>...
1
by: Randall Sell | last post by:
OK, I am utterly stumped. The code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <style type="text/css"> ul {...
4
by: Matt | last post by:
Hi, Got an unordered list with 100% width, with 5 list items of 20% width styled to fill the width of the container element. Renders fine in Mozilla, but when you change the size of the window...
4
by: abs | last post by:
Anybody has an idea how to get the <ul> element which is not nested in <li> element ? In other words I have several lists like this: <ul id="1"> <li>Aaaaaaaa</li> <li>Bbbbbbbb</li>...
2
by: Shaun | last post by:
Hello! I have a quick question regarding CSS and having it applied to all elements. I am trying to eliminate the gap between a paragraph and a list that usually occurs in html and I've found...
2
by: Andrew Donaldson | last post by:
I'd welcome some help in understanding what's going on with graphical browsers in the navigation list at: http://www.bounceandtickle.org.uk/index.html (This site is not about what it might...
5
by: Syl | last post by:
Hello experts!! The top menu navigation bar displays perfectly in IE, but does not display properly in Mozilla or Netscape : http://checkeredshirt.com/textonly.html For some reason the non-IE...
9
by: eros | last post by:
<li>List <ul> <li>List1</li> <li>List2</li> <li>List3</li> </ul> </li> How to call the php code from that html tags... when I click List1?
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.