>
Can anyone help me out with this menu.
>
I would like the 'white' active tab to look like it is attached (no thin
blue line) to the content. I cannot work out how to do it.
#TopNav ul {
position:relati ve;
top:3px;
}
Only tested in FF.
>
Can anyone help me out with this menu.
>
I would like the 'white' active tab to look like it is attached (no thin
blue line) to the content. I cannot work out how to do it.
>
Many thanks,
>
EA
As Far as I can determine using negative numbers have no effect. I have
tried margin-bottom: -1px as above and also -6px in testing and nothing!
Anyone else got ant ideas?
EA
"Martin Eyles" <martin.eyles@N OSPAMbytronic.c omwrote in message
news:12mav4vc5j itmf8@corp.supe rnews.com...
"EA" <NOSPAM@twelve. me.ukwrote in message
news:45657969$0 $8758$ed2619ec@ ptn-nntp-reader02.plus.n et...
>http://www.doublesix.plus.com/Examples/Test.htm
>>
>Can anyone help me out with this menu.
>>
>I would like the 'white' active tab to look like it is attached (no thin
>blue line) to the content. I cannot work out how to do it.
>>
>Many thanks,
>>
>EA
>
Try adding
>
#TopNav #selected {
padding-bottom: 1px;
margin-bottom: -1px;
}
>
to your CSS.
>
Thanks for trying, but this does not work.... or at least you have not
provided me with enough instruction on how to implement it.
I am using IE 6.0.
EA
"Els" <els.aNOSPAM@ti scali.nlwrote in message
news:1rs264993n 67f$.1ban3y5srt k01$.dlg@40tude .net...
EA wrote:
>
>http://www.doublesix.plus.com/Examples/Test.htm
>>
>Can anyone help me out with this menu.
>>
>I would like the 'white' active tab to look like it is attached (no thin
>blue line) to the content. I cannot work out how to do it.
>
As Far as I can determine using negative numbers have no effect. I have
tried margin-bottom: -1px as above and also -6px in testing and nothing!
>
Anyone else got ant ideas?
>
EA
>
You started with this:
#TopNav #selected {
font-weight: bold;
background-image: url(SelectedMen uTab-Right.gif);
border-bottom : 1px solid white;
}
and you understood you should *add* this:
padding-bottom: 1px;
margin-bottom: -1px;
and somehow you got this:
#TopNav #selected {
background-image: url(SelectedMen uTab-Right.gif);
padding-bottom: 1px;
margin-bottom: -6px;
}
My idea is that you're not being very careful in what you're doing. I
also see the problem with newTest.htm in IE6, but that's a page which
includes neither Els's nor Martin's suggestions. Both their tips helped
when I tried them separately in FF. Did they help *you* when you viewed
them in Firefox?
Using the above version I have tested this in IE 6.0 and Firefox. I
actually have no idea the relevance of whether this words in Firefox because
I said I was working with IE 6.0. However maybe to people more clever than
I, testing in Firefox may mean something.
In Firefox I get something better than IE, but not something I would be
happy with if this was my target browser. yes I lose the line under the
'selected' tab, but there are now small gaps (on the bottom line of TopNav
before the 'Tables' tab and either side of the selected 'History' tab. As
mentioned above I am not targeting the Firefox browser as I cannot tell my
users to us this because it is 'better' the IE.
In IE I do not get the desired effect as the line still appears under the
selected tab. Can anyone help me?
EA
"John Hosking" <John@Hosking.n ame.DROPTHE.inv alidwrote in message
news:45664bdd_3 @news.bluewin.c h...
Please don't top post; it makes it hard to follow the flow of discussion.
I have moved your reply down for you this time.
>
EA wrote:
>>>"EA" <NOSPAM@twelve. me.ukwrote in message
>>>news:4565796 9$0$8758$ed2619 ec@ptn-nntp-reader02.plus.n et...
>>>
>>>>http://www.doublesix.plus.com/Examples/Test.htm
>>>>
>>>>Can anyone help me out with this menu.
>>>>
>I am assuming you mean that I should add the two lines below.
>>
>I have done with and with IE 6.0 it makes no difference:
>>
>http://www.doublesix.plus.com/Examples/newTest.htm
>>
>As Far as I can determine using negative numbers have no effect. I have
>tried margin-bottom: -1px as above and also -6px in testing and nothing!
>>
>Anyone else got ant ideas?
>>
>EA
>>
You started with this:
#TopNav #selected {
font-weight: bold;
background-image: url(SelectedMen uTab-Right.gif);
border-bottom : 1px solid white;
}
>
and you understood you should *add* this:
padding-bottom: 1px;
margin-bottom: -1px;
>
and somehow you got this:
#TopNav #selected {
background-image: url(SelectedMen uTab-Right.gif);
padding-bottom: 1px;
margin-bottom: -6px;
}
>
My idea is that you're not being very careful in what you're doing. I also
see the problem with newTest.htm in IE6, but that's a page which includes
neither Els's nor Martin's suggestions. Both their tips helped when I
tried them separately in FF. Did they help *you* when you viewed them in
Firefox?
>
--
John
Top posting is one of the things that keeps people from helping you.
Please look it up or Google it or ask somebody what it means. I have
fixed this for you again.
>>Please don't top post; it makes it hard to follow the flow of discussion.
>>I have moved your reply down for you this time.
I *knew* I had said something about this...
>[back-and-forth snipped]
>>
>>My idea is that you're not being very careful in what you're doing. I also
>>see the problem with newTest.htm in IE6, but that's a page which includes
>>neither Els's nor Martin's suggestions. Both their tips helped when I
>>tried them separately in FF. Did they help *you* when you viewed them in
>>Firefox?
>>
>
You may have been right in that I have 'experimented' myself, trying to use
the advice given to solve my problem.
>
>
Using the above version I have tested this in IE 6.0 and Firefox. I
actually have no idea the relevance of whether this words in Firefox because
I said I was working with IE 6.0. However maybe to people more clever than
I, testing in Firefox may mean something.
Firstly, the presumption is that, since you are authoring for the WWW,
you can expect visitors using Firefox (and other non-IE browsers) to
show up. You would want to know what /they/ see, is the presumption.
Secondly, IE is *known* to be special, so testing in, say, a second
browser might give you (and us) more info.
Thirdly, I edited your CSS on your site using the suggestions from Els
and Martin using Firefox, because Firefox has a Web Developer Toolbar
addon which lets me do this easily. (IE has a similar addon, too; you
ought to get it.) Now, when I tried the suggestions *in my Firefox*, it
worked, so if we see that it works for *you in Firefox*, then we can say
that we are talking about the same thing. Since I only see the code on
your site *without* the suggested changes, I can't know what you're
looking at.
>
In Firefox I get something better than IE, but not something I would be
happy with if this was my target browser.
There is no "target browser" on the World Wide Web, is there?
yes I lose the line under the
'selected' tab, but there are now small gaps (on the bottom line of TopNav
before the 'Tables' tab
Here's why: You have an #Outer div containing two other divs, #TopNav
and #Content. All three are assigned a width of 800px. But div#Outer has
a border of 3px (making it 806px wide) and the other two divs have 2px
borders (making then 804px wide). Change the border for #Outer to 2px,
and your problem goes away.
and either side of the selected 'History' tab. As
mentioned above I am not targeting the Firefox browser as I cannot tell my
users to us this because it is 'better' the IE.
I cannot fathom this statement. It's true you can't require your users
to use Firefox; they will tell *you* what they want to use (well
actually, they will just use it). And "IE is better"
(paraphrased/translated to English)? Global experience does not agree,
and besides, that's in conflict with your statement "In Firefox I get
something better than IE" above. Whatever are you talking about?
>
In IE I do not get the desired effect as the line still appears under the
selected tab. Can anyone help me?
>yes I lose the line under the 'selected' tab, but there are now small
>gaps (on the bottom line of TopNav before the 'Tables' tab
>
Here's why: You have an #Outer div containing two other divs, #TopNav and
#Content. All three are assigned a width of 800px. But div#Outer has a
border of 3px (making it 806px wide) and the other two divs have 2px
borders (making then 804px wide). Change the border for #Outer to 2px, and
your problem goes away.
If I understand correctly, your paragragh above advises me that if I change
the #Outer div border from 3px to 2px the problem disappears. I have done
that to:
When I view it in Firefox there are still small three gaps along the top of
the #context div, the first is before the Tables tab, the second is before
the 'selected' History tab, and the third after this tab. Do you see these?
Am I trying for perfection which cannot be obtained?
>and either side of the selected 'History' tab. As mentioned above I am
>not targeting the Firefox browser as I cannot tell my users to us this
>because it is 'better' the IE.
>
I cannot fathom this statement. It's true you can't require your users to
use Firefox; they will tell *you* what they want to use (well actually,
they will just use it). And "IE is better" (paraphrased/translated to
English)? Global experience does not agree, and besides, that's in
conflict with your statement "In Firefox I get something better than IE"
above. Whatever are you talking about?
>>
>In IE I do not get the desired effect as the line still appears under the
>selected tab. Can anyone help me?
>
I'm *trying*.
Am I to conclude that you are not or cannot assist with this issue in IE.
All you assistance is in Firefox, which while from ytour comments assists
yoiu, is of little actual use to me because I want my page to work in IE. I
am not clever enough to understand all the hacks that appear to be needed to
make web pages work in all browsers so I am making the decision that I would
like to have mine work in IE, if they work in others too that is a bonus for
me.
I do apologise for not bottom posting in my last message.
All I want is my issue solved in IE - can you assist?
Comment