CSS help - Overclock.net

*dangerousHobo* · 06-05-08

Well I'm new to web coding and have a lot to learn. I need some help though with using CSS and setting the color of links.

I have the following stylesheet:

Code:

.magazine_cover {
    position: relative;
    margin: 0px; padding: 0px; 
     width:477px;
    _width:477px;
    height:556px;
    float:left;
    border-left:#000;
    padding-left: 15px;
    color: black;
}
.magazine_cover .title {
    position: absolute;
    top: 20px; left: 0px;
    width: 492px; text-align: center; 
    line-height: 30px;
    height: 30px;
    font-size: 30px; font-weight; bold; color: #fff;
}
.magazine_cover .link {
    position: absolute;
    width: 120px; 
    line-height: 20px;
    height:30px;
    font-size: 16px;
}

And in my .html file,

<div class="link" style="a:link {color:green}; a:visited {color:green};"> <a href="#">..</a></div>

Is that the proper way to set the color for a link? Is there an easy way to put that in a new class like:

Code:

.magazine .link .green {
....
....
}

Thanks!

Boris4ka · 06-05-08

You're doing it wrong.

For the HTML, it would be:

Code:

<div class="magazine_cover">
<a href="http://www.google.com">Google</a>
</div>

And the CSS for that would be:

Code:

.magazine_cover{
*put your parameters for the whole div here*
}

.magazine_cover a{
*put styling for links here*
}

.magazine_cover a:hover{
*put styling for hover on links here*
}

.magazine_cover a:visited{
*put styling for visited links here*
}

pow3rtr1p · 06-05-08

I thought Hobo started playing games. Guess not, lol.

*dangerousHobo* · 06-05-08

Well the stylesheet was given to me by my boss.

The problem is though I can't hard code the color in the stylesheet b/c its a RoR app.

So really in my code the div looks:

<div class="link" style="<%= next_cover_link_pos(count) %> a:link {color:<%= cover.link_color %>;}" >
<%= "<a href=\""+link.url+"\">"+link.title+"</a>" %>
</div>

*dangerousHobo* · 06-05-08

Well I got what I needed. For anyone interested:
Little ugly if you don't know Ruby on Rails.

At the top of my page I load a stylesheet that lets me set the color according to the cover object.

Code:

<% content_for 'stylesheet' do %>
<style>
    a.link_color:link {color:<%= @cover.link_color %>;}
    a.link_color:visited {color: <%= @cover.link_color %>;}
    a.link_color:hover {color:blue;}
</style>
<% end %>

and then the div is simply:

Code:

<div class="link" style="<%= next_cover_link_pos(count) %>" >
   <%= "<a class=\"link_color\" href=\""+link.url+"\">"+link.title+"</a>" %>
 </div>

		Overclock.net - Overclocking.net > Software, Programming and Coding > Coding and Programming > Web Coding
CSS help

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)