•
•
•
•
What is DaniWeb IT Discussion Community?
You're currently browsing the HTML and CSS section within the Web Development category of DaniWeb, a massive community of 361,561 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,015 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our HTML and CSS advertiser: Lunarpages Web Hosting
Views: 539 | Replies: 3 | Solved
 |
•
•
Join Date: Apr 2008
Posts: 18
Reputation: 
Rep Power: 1
Solved Threads: 1
Newbie Poster
I have attempting a small navigation system to show each page in my photo albums. I am attempting block links (coloured backgrounds, which change when the mouse hovers over them).
The page I'm working on is: http://www.equinefocus.co.uk/personal/gallery2.php
I achieved the look I wanted with the 1-4 links at the top of the page, but unfortunately, the thumbnails were affected too. I have attempted adding a span class so that the only links affected were the 1-4 ones, but it hasn't worked.
My HTML code:
My CSS Code:
Any thoughts on where I'm going wrong?
The page I'm working on is: http://www.equinefocus.co.uk/personal/gallery2.php
I achieved the look I wanted with the 1-4 links at the top of the page, but unfortunately, the thumbnails were affected too. I have attempted adding a span class so that the only links affected were the 1-4 ones, but it hasn't worked.
My HTML code:
<span class="links"> <a href="/photos/other/2008-04-27/page01.php">1</a> <a href="/photos/other/2008-04-27/page02.php">2</a> <a href="/photos/other/2008-04-27/page03.php">3</a> <a href="/photos/other/2008-04-27/page04.php">4</a> </span>
My CSS Code:
span.links {
a:link {
color: #000000;
background-color:#99ccfb;
border: 1px solid #000000;
padding: 5;
text-decoration:none;}
a:visited {
color:#000000;
background-color:#c0c0c0;
border: 1px solid #000000;
padding: 5;
text-decoration:none;}
a:hover {
color:#FFFFFF;
background-color:#b90dbe;
border: 1px solid #000000;
padding: 5;
text-decoration:none;}
}Any thoughts on where I'm going wrong?
•
•
Join Date: May 2008
Posts: 3
Reputation:
Rep Power: 0
Solved Threads: 1
Newbie Poster
What you need to do is create your own class to use on the links you want to change.
You can create a new class by defining it in the CSS using a . for example:
.cheese {}
You can then assign the class to the link using class="cheese" when you create the link.
All the attributes you define in that class will carry over to the link.
To change the links in class cheese define it like this:
.cheese a:hover{whatever you like}
Hope that helps.
You can create a new class by defining it in the CSS using a . for example:
.cheese {}
You can then assign the class to the link using class="cheese" when you create the link.
All the attributes you define in that class will carry over to the link.
To change the links in class cheese define it like this:
.cheese a:hover{whatever you like}
Hope that helps.
•
•
Join Date: Jan 2008
Location: Bali - Indonesia
Posts: 58
Reputation:
Rep Power: 1
Solved Threads: 6
Junior Poster in Training
Try it like this Borderline
.links a:link {
color: #000000;
background-color:#99ccfb;
border: 1px solid #000000;
padding: 5;
text-decoration:none;
}
.links a:visited {
color:#000000;
background-color:#c0c0c0;
border: 1px solid #000000;
padding: 5;
text-decoration:none;
}
.links a:hover {
color:#FFFFFF;
background-color:#b90dbe;
border: 1px solid #000000;
padding: 5;
text-decoration:none;}
} If love is blind, why there's a bikini ??
Post your article at Bali Side Notes share your knowledge
Download punk mp3 for free | Download Classic Rock mp3 for free
Post your article at Bali Side Notes share your knowledge
Download punk mp3 for free | Download Classic Rock mp3 for free
|
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
•
•
•
•
•
•
•
•
DaniWeb HTML and CSS Marketplace
Linear Mode
Similar Threads
- Firefox Compatibility help with script (JavaScript / DHTML / AJAX)
- has no properties... (JavaScript / DHTML / AJAX)
- problem in javascript coding in asp page (ASP)
- Pop-Up Calendar for ASP (ASP)
- Zone Alarm Security Alerts. (Viruses, Spyware and other Nasties)
- more "home search assistent" fun... (Viruses, Spyware and other Nasties)
- I can't remove about:blank (Viruses, Spyware and other Nasties)
Other Threads in the HTML and CSS Forum
- Previous Thread: Drop down
- Next Thread: HTML prob - firefox and ie...
