|
| |
|
|
bdaul
Posts: 24
Joined: 12/25/2003
From: Palo Alto
Status: offline
 |
CSS and a.link - 5/6/2004 1:42:39
I understand the following but...
a:link, a:visited {color: #000000;
text-decoration: underline;
font-size: 8pt;}
If I have a page and I want the size of links in one part a different size how do I swing this...say
THIS WOULD BE A LINK perhaps font-size 12pt
for the footer of the page I want the link text to be font-size 8pt
Thanks, ---bill
|
|
|
|
Peppergal
Posts: 2207
Joined: 9/20/2002
Status: offline
|
RE: CSS and a.link - 5/6/2004 2:50:27
You would have to set up a different "class" for the second set of links.
A:LINK {blah blah blah]
then your other one would be
A.smaller:LINK {blah blah blah}
Then, in your html, where you'd want your smaller links, you would type the class in each link tag:
<a class="smaller" href="page.htm">link</a>
< Message edited by Peppergal -- 5/6/2004 14:15:43 >
_____________________________
Northeast PA / Poconos/ Lake Wallenpaupack Real Estate
wallenpaupacklakeproperty.com
Karen's Real Estate Blog
| |
|
|
|
Giomanach
Posts: 6128
Joined: 11/19/2003
From: England
Status: offline
|
RE: CSS and a.link - 5/6/2004 3:35:18
quote:
A:LINK.smaller {blah blah blah}
Or:-
.smaller a:link {gibberish}
But this way you have to give it:
<span class="smaller"><a href="page.htm">Link</a></span>
Dan
_____________________________
| |
|
|
|
d a v e
Posts: 4167
Joined: 7/24/2002
From: England (but live in Finland now)
Status: offline
|
RE: CSS and a.link - 5/6/2004 3:54:39
or apply the class (smaller) to the html element containing the different links
e.g. <div class="smaller"> or table or td, or p, or... that way you only have to set it once rather than applying a span to each link
_____________________________
David Prescott
Gekko web design
| |
|
|
|
bdaul
Posts: 24
Joined: 12/25/2003
From: Palo Alto
Status: offline
|
I can't seem to delete this note - 5/6/2004 5:36:25
Note:
Using IE on this link http://www.frameproproductsllc.com/xx/products.html
The CONTACT US link does what I want it to. I want the same thing to happen to the navigation bar at the bottom of the page...
I put both CSS elements into css.css
a:link, a:visited {color: navy;
text-decoration: underline;
font-size: 8pt;}
a:hover, a:active {color: #ff0000;
text-decoration: color: yellow;
}
a:link.large, a:visited {color: navy;
text-decoration: underline;
font-size: 100%;
}
a:hover.large, a:active {color: #ff0000;
text-decoration: none;
}
===================================
The links using the "large" class do exactly what I want...the regular links using <a> are doing something I can't figure out. I think it has something to do with a DIV I created for the navigation bar too:
div#footer { position: absolute; top:700px; left:210px; width:530px; height:400px;
font-size: 8pt; font-style: font-family: arial; font-weight: extra bold; color: navy; }
How can I get the <a> and DIV footer to behave like the "large" class item...the difference is the font size.
Thanks again you wizard-like folks.
--bill
< Message edited by bdaul -- 5/6/2004 6:04:41 >
| |
|
|
|
Giomanach
Posts: 6128
Joined: 11/19/2003
From: England
Status: offline
|
RE: I can't seem to delete this note - 5/6/2004 7:28:12
Don't use points for sizes, use pixels or ems, they will work better. Also remove the div from div#footer. The hash (#) defines that it is an ID for CSS elements. Just have the opening tag for the div layer as <div id="footer">
Dan
_____________________________
| |
|
|
|
bdaul
Posts: 24
Joined: 12/25/2003
From: Palo Alto
Status: offline
|
RE: CSS and a.link - 5/6/2004 18:17:51
Gorilla,
I changed things as you suggested...
CSS:
footer { font-style: ; font-weight: ; font-size: 12px; position: absolute; top: 700px; left: 210px; width: 630px; height: 400px }
HTML:
<footer>
<a href="index.html">HOME</a> | <a href="company.html">COMPANY</a> | <a href="products.html">PRODUCTS</a> | <a href="dealers.html">DEALERS</a> | <a href="safety.html">SAFETY</a> | <a href="news.html">NEWS</a> | <a href="spotlight.html">SPOTLIGHT</a> | <a href="contactus.html">CONTACT</a> | <a href="privacy.html">PRIVACY</a></footer>
NOW the navigation bar (HTML) is printed at the top of the screen and not where I instructed it using position, top, left, ...
Thanks again, --bill
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
. 