link does not change color

  • Resolved davy_yg

    (@davy_yg)


    14 years, 4 months ago

    index.php

    <div id="content">
    <div id="main">
	<h4>Latest News</h4>
		<p style="border-bottom: 2px dotted #FF0000; width: 620px;"></p><br />
		<div class="post">

	<?php if (have_posts()) : ?>
		<?php while (have_posts()) : the_post(); ?>

            <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/pic1.png" ALT="picture1" ALIGN=LEFT><div id="ptitle"><?php the_title(); ?><font color="black"> - <?php the_time('d'); ?>&nbsp<?php the_time('M'); ?>&nbsp<?php the_time('Y'); ?></font></div>

            <p><?php the_content(''); ?>... <a href="#">read more ></a></p>
<p style="border-bottom: 2px dotted #FF0000; width: 700px;"></p><br />

    style.css

    #content #main {
	width: 620px; float: left;
	}

#content #main .post {
	position: relative; margin: 0 0 60px 40px; padding: 0 0 0 0; overflow: hidden;
	}
#content #main h4 {
	margin: 0 0 0px 40px;
	font: 14px Lucida Grande, Lucida Sans Unicode, Helvetica, Sans-Serif; letter-spacing: normal;
	}
#content #main .post p {
	font:Arial, Helvetica, sans-serif; font-size: 12px;
	}

#content #main .post #ptitle {
	font:Arial, Helvetica, sans-serif; font-size: 14px; color:red;
	}

#content #main .post #pdate {
	font:Arial, Helvetica, sans-serif; font-size: 14px;
	}

#content #main .post image {
	margin: 0 10px 0 0;
	}
#main .post p a:link{
	font:Arial, Helvetica, sans-serif; font-size: 12px; color: ed;
	text-decoration: none;
	}

    I wonder why the read more > which suppose to be red color with no underline still remain blue color with underline ?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thomas Clausen

    (@thomasclausendk)

    14 years, 4 months ago

    You forgot an “r”:
    color: ed;

    Thread Starter davy_yg

    (@davy_yg)

    14 years, 4 months ago

    Well,

    I actually already have color: red; I think I copas incorrecly.

    This is what I already have:

    #main .post p a:link{
font:Arial, Helvetica, sans-serif; font-size: 12px; color: red;
text-decoration: none;
}

    Thomas Clausen

    (@thomasclausendk)

    14 years, 4 months ago

    Instead of a:link I would just use a, because a:link only targets unvisited links.

    For example:

    #main .post p a {
font:Arial, Helvetica, sans-serif; font-size: 12px; color: red;
text-decoration: none;
}
#main .post p a:hover {
text-decoration: underline;
}

    See http://www.w3schools.com/css/css_pseudo_classes.asp for more information.

    I also noticed in your index.php file you have the following inline styles applied:

    <h4>Latest News</h4>
<p style="border-bottom: 2px dotted #FF0000; width: 620px;"></p><br />

    I would just change the HTML to:
    `<h4>Latest News</h4>’
    And then change the appereance in the stylesheet with:
    #content #main h4 { width: 620px; border-bottom: 2px dotted #FF0000; }
    and control the placement of the dotted line with padding and margin.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘link does not change color’ is closed to new replies.

Tags