Log in

View Full Version : CSS gurus - ?


Big Dave
6th August 2008, 18:45
You know how there are different styles for links: visited, hover, active, etc etc.

Is there a style for 'current page' ?

Say I'm on the 'about.html' page - can I make the about.html link in the nav menu display a different style when it's on that page?

Never seen it - but worth a ping.
pzkpfw
6th August 2008, 19:12
I think "no", but as I hate HTML and CSS (I "do" some, but am no guru) am happy to be called stupid, or just wrong.

Is the HTML hardcoded or "built" by ASP, PHP, ASPX or something?

Is J(ava)Script in use?
skelstar
6th August 2008, 19:24
No that I know of, however you could use PHP to check, and change your style on the fly (dynamically?).

Otherwise www.w3schools.com is a good resource. Try the page about pseudo classes (http://www.w3schools.com/css/css_pseudo_classes.asp), and elements on the next page.
Big Dave
6th August 2008, 19:30
I think "no", but as I hate HTML and CSS (I "do" some, but am no guru) am happy to be called stupid, or just wrong.

Is the HTML hardcoded or "built" by ASP, PHP, ASPX or something?

Is J(ava)Script in use?

hard via dreamweaver and text editor mix. diy style sheets.
Skunk
6th August 2008, 19:50
You could still use a scripting language to query the page as to which one it is and change CSS to suit.
I've done it with a PHP include menu file which has 'sticky' rollovers.
Scarydog
6th August 2008, 19:55
There isn't an automatic solution. But there are solutions that are easier to maintain than others. One solution we use sometimes is as follows (the following is essentially a sketch :-):


--- in an external style sheet ---
<style>
li.nav ul { font-weight: normal }
#home li.nav ul.home, #about li.nav ul.about, #another li.nav ul.another { font-weight: bold }
</style>

---Page 1 ---
<body id="about">
<li id="nav">
<ul class="home">Home</ul>
<ul class ="about">About</ul>
<ul class ="another">Another Page</ul>
</li>
</body>

---Page 2 ---
<body id="home">
<li>
<ul class="home">Home</ul>
<ul class ="about">About</ul>
<ul class ="another">Another Page</ul>
</li>
</body>

So the above probably doesn't actually work - but hopefully it shows the idea :-).

You can hard code the class on to the body tag or better have it written in dynamically.

Let me know if this makes no sense :-)
Big Dave
6th August 2008, 20:56
There isn't an automatic solution. But there are solutions that are easier to maintain than others. One solution we use sometimes is as follows (the following is essentially a sketch :-):


--- in an external style sheet ---

li.nav ul { font-weight: normal }
#home li.nav ul.home, #about li.nav ul.about, #another li.nav ul.another { font-weight: bold }


---Page 1 ---


Home
About
Another Page



---Page 2 ---


Home
About
Another Page


So the above probably doesn't actually work - but hopefully it shows the idea :-).

You can hard code the class on to the body tag or better have it written in dynamically.

Let me know if this makes no sense :-)

Yeah - I see it. Thanks.

For 6 or so relevant pages on this site it's easier to remove the link and just text style it.

this is an upgrade - time is moolah and all that.

Next time I'm starting from scratch will give it a try.
98tls
6th August 2008, 21:00
Damn you boys make life complicated.
Big Dave
6th August 2008, 21:03
Damn you boys make life complicated.

Beats watching TV - unless there is a game of something worthwhile on.
98tls
6th August 2008, 21:37
Beats watching TV - unless there is a game of something worthwhile on. Agreed,i hate TV.Watch it less now Mr deans moved.The garage and an assortment of 2 wheelers both young and old is nirvana to this ole boy.
Big Dave
6th August 2008, 21:41
.Watch it less now Mr deans moved.

I said 'worthwhile'. :innocent: