Change the color of some links but not others

Posted by j0k3z on October 2, 2006 at 2:59am

Hello,

How can I change the color of some links but not others? Currently they are all grouped together in my css file as 'a' but im not sure how to make it into more types.

Basically I want to edit my forum so that the link for container names are black so they show up better on the container background.

I made the bg color of my forum container orange and it just so happens that all my links are orange so it will not show up very nicely. Im looking in the tpl files but Im not sure where to make the changes

Comments

use css

Posted by stevenlyons on October 2, 2006 at 3:52am

you will have to use css classes to distinguish between different types of links. this is basic css. there are many good sites to help you:

http://www.htmldog.com/
http://www.htmlhelp.com/reference/css/structure.html

Will that work though? I

Posted by drawk on October 2, 2006 at 3:58am

Will that work though? I haven't made extensive use of the forum module, but do have it set up on a site that is sitting on my test server at the moment.

For the container titles, I see:
div #forum > table > tbody > tr [.odd or .even] > td .forum > div > div .name > a

and for the forum titles, I see:
div #forum > table > tbody > tr [.odd or .even] > td .forum > div > div .name > a

If I understood the original poster's question correctly, how will he distinguish via CSS?

---
www.whatwoulddrupaldo.org

I know I need to use css

Posted by j0k3z on October 2, 2006 at 4:04am

I know I need to use css classes. I just cant seem to find the correct file to edit this in.

Where is the main forum layout controled from?

ALso, if you see my forums are messed up http://www.chicagolanddining.com/drupal/forum/sample-forum-topic

How can I place the reply links at the bottom of each reply so they are not floating all over in the middle.

Look in style.css

Posted by nevets on October 2, 2006 at 4:30am

Look in style.css for

.comment-right  .links {
font-size: x-small;
font-weight: bold;
}

and change to

.comment-right .content .links {
font-size: x-small;
font-weight: bold;
float: left;
}

You need the .content so it will override styling in drupal.css and change it so the links float to the left.

I followed your changes but

Posted by j0k3z on October 2, 2006 at 5:03am

I followed your changes but nothing has changed on my website.

No styling at all.

Posted by nevets on October 2, 2006 at 2:01pm

Your sample forum topic link above now produces a page without any styling so I can not check the problem out. Currently style.css does not seem to be included at all.

http://www.chicagolanddining.

Posted by j0k3z on October 3, 2006 at 3:14am

http://www.chicagolanddining.com/drupal/forum

The containers have a dark gray color. The links in these containers are orange because that is the color of all of my links. How can I change this color?

Here are some css rules to try

Posted by nevets on October 3, 2006 at 3:36am

You can add the following to your style.css file (needs to be after in less specific rule for the a tag. Note this is a starting point as you may want rules for :visited, :hoover etc.

#forum table td.container a {
color: white;
}
#forum table td.forum a {
color: black;
}
#forum table td.last-reply a {
color: blue;
}

First rule covers links in the dark grey, the second the links to the individual forums. The last covers the link to the user (under last reply)

Wow, that worked perfectly!

Posted by j0k3z on October 3, 2006 at 5:41am

Wow, that worked perfectly! I have a lot to learn about css.

Thank you so much

I am trying to adjust the

Posted by j0k3z on October 3, 2006 at 10:44am

I am trying to adjust the width of my forum on this page.
http://www.chicagolanddining.com/drupal/forums/test-container/test-forum-1

This page has the sidebars removed so I want the forum to expand to fill the sidebar. But the main forum page has sidebars so the width is different. http://www.chicagolanddining.com/drupal/forum

Is there a way to adjust this in css?

A rough guide to making the right column disapear

Posted by nevets on October 3, 2006 at 2:37pm

From the html/css in your page.tpl.php you have something like

<div id="left">
  ...
</div>
<div id="right">
  print $sidebar_right;
</div>

And in style.css you have rules for #left and #right that set the size of each area. One way to achieve what you want is to do things conditionally based on if the right sidebar is present or not. So you might do something like this (note this code assumes your right sidebase is from the sidebar_right region, you may need to change this to reflect your theme)

<?php
  if ( $sidebar_right ) {
    $main_class = 'left';
    $show_sidebar = TRUE;
  }
  else {
    $main_class = 'all';
    $show_sidebar = FALSE;
  }
?>
<div id="<?print $main_class; ?>">
  ...
</div>
<?php if ( $show_sidebar ) { ?>
<div id="right">
  print $sidebar_right;
</div>
<?php } ?>

And then in style.css you will want to add something like

#all {
  display: block;
  width: 100%;
  margin: 0;
}