Ie code not working

Hi

Please have a look at the following link:
http://www.articlecon.com/demo/joey40/zumba/

There are a couple problems in it.

  1. When “about” page is opened, the whole page jumps down a few pixels leaving a white gap at the top of the page. It does not happen on any other page.

  2. I have included this code in the head:

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="../css/ie.css" />
<![endif]-->

But it does not work. As a test I set the p font color to red but it does not show red text in ie. What is wrong in this code? I included ie.css for ie png fixes and general ie fixes.

Thanx

Normally adding a class like
li.selected {
special styles;
}
works great. It’s listed once in your CSS sheet… you can use PHP to dynamically add that class to the correct list item if you are using an include (single file) for your menu.

I presume that you would like to indicate which page a visitor is on? If so you can use a class i.e.


a.current {
    color: #00FF00; text-decoration:underline;
}

and apply this to the appropriate link. So if you’re on the About Zumba page


<li><a href="http://www.articlecon.com/demo/joey40/zumba/about.html" class="current">home</a> </li>

I hope this is what you mend.

I have another issue with this page. The a:active does not work. An active and hovered uopn link is supposed to be green and underlined. But it only does this on :hover and not on :active.
Can you please tell why this behavior?

and switch them too!

Is the path correct?
href=“…/css/ie.css”

It looks different from where you’re keeping your main css
href=“css/main.css”

Took care of the br tag. Thanx.

The ie.css is still not called. I put the ie.css after main.css but nothing happened. Is anything else wrong in the code?

Yes, that is exactly what I had in mind now. Thanx

There is a <br> element on that page before the first div. Just remove it.

  1. I have included this code in the head…

You must put the IE link after the main CSS link, as the later stylesheets override the earlier. Change this:

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="../css/ie.css" />
<![endif]-->

<link rel="stylesheet" type="text/css" href="css/main.css" />

to

<link rel="stylesheet" type="text/css" href="css/main.css" />

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="../css/ie.css" />
<![endif]-->

Thanx. I really thought it indicated the current page. My mistake.

I shall try javascript or php. I know a little about them to accomplish the task.

Thank you for the help.

A:active does not mean “what page I’m on”. :active means “holding the mouse or keyboard button down right now”.

It’s only active so long as you’re holding the button down. “I’m actively clicking it”.

We use the method donboe mentions most of the time, though it’s not the only way.

Thanx donboe. Yes that is one way to do it. But im sure it can also be done through a:active css pseudo classs. Due to some reason I can’t use the method you have mentioned, i.e. assign a particular class for every active page.

I would like to achieve this through a:active if possible. Thank you for the input.

Well spotted, poes. There’s no css file at that location. Though, in the example linked to above, the css files haven’t been switched.

Hi
Thank you. I’ll correct the path accordingly now.