Web Development

General discussion

Gravatar
0 Votes
Locked

CSS Question

By bryan.zimmerman ·
Greetings,

This is my first post so be gentle.

I have defined link properties using CSS and everything works like a charm. There are links on the bottom of the page that I would like to give a smaller text size but with the same CSS qualities as their parent definitions.

I have tried defining a seperate class for the smaller text, but the parent CSS link qualities prevail.

what is the proper workaround for this? Or should I have set the page up differently? Your help will be much appreciated and I look forward to becoming part of such a great community!

Bryan

This conversation is currently closed to new comments.

Thread display: Collapse - | Expand +

All Comments

gravatar
Collapse -

by deron.blevins In reply to CSS Question

It's probably how you are defining the new CSS style for the smaller text. What tag do you have the style linked to? (<p>, <td>, <span> etc..)

I do this pretty extensively if you want to check out my CSS / code and see how I do it: try www.divisionusa.com for an example of how I label my code.

gravatar
Collapse -

Tag

by bryan.zimmerman In reply to

I was attaching it to the <p> tag. What do you suggest?

Thanks for the reply.

Bryan

gravatar
Collapse -

<p class="newlayout">

by roshanjoseph In reply to Tag

what is you do the following: <p class="newlayout">

I'm sure the text in this tag will display according to the presentation you want.

An alternative is to use <span class="newlayout"> within the <p> tags

gravatar
Collapse -

CSS Answer

by jacquel In reply to CSS Question

The best way of handling it is to define a footer ID in your stylesheet w/ the appropriate properties, then define the properties of links within a div of that ID.

Ex.
/* Footer elements */
#footer {height:22px;
background-image : url(../images/bkg_menubar.jpg);
z-index : 2;
font-size : 8pt;
font-family : Verdana, "Microsoft Sans Serif", sans-serif;
vertical-align : bottom;
width : 100%;
}

div#footer a, a:link {FONT-SIZE: 8pt; COLOR: #F5F5F5; FONT-FAMILY: Verdana, "MS Sans Serif", sans-serif;
background-color : transparent;
text-decoration : none;
vertical-align : bottom;
}

Encase your footer area in a <div id=footer></div> tag and the links w/in the footer area will display appropriately.

gravatar
Collapse -

<small> tag, the often-missed alternative

by bors235 In reply to CSS Question

I instances such as these, wrap the area in question (as much as you want) in the <small>Your footer text here</small>. Be sure you nest properly using valid HTML.

Back to Web Development Forum

Start or search

Related Discussions

Related Forums