p91 problem with css

Timmy24 · June 19th, 2015, 04:43 PM

I am stuck on making the text in the main content area the correct colours according to the css. I have followed the examples in the book and checked my code but the visited and underline links dont show the correct colours. When visited I find that when I test the website the "look around" text is purple instead of red. If I delete my browsing history from Chrome it reverts to blue instead of green and then when I click it becomes purple instead of red. The hover mode never works at all though.

Bit strange as Ive followed the example from the book, I tried going to other websites and found blue and purple are the standard colours as if some setting on my pc is making them this way, why is it ignoring the css?

SHOOGN · June 25th, 2015, 03:39 AM

double click on the word you want to convert it to the hyperlink and go to the format in the tool bar click on (convert to hyperlink) and then press on browse button to chose that page you want
to appear underline when put the mouse on the link go to the css file >>>type
a:hover
{

text-decoration : underline;
}

--------
sorry my English language very bad
I hope this help

Imar · June 25th, 2015, 02:42 PM

Can you post the CSS for the page? Maybe there's something wrong there?

Also, try a different browser and see if the behavior is different there?

Imar

Timmy24 · June 28th, 2015, 02:42 PM

I have tried using Internet Explorer as well as Chrome and found the same behaviour.

Here is the Css :

#MainContent a
{
color: #008000;
text-decoration: underline;
}

#MainContent a:visited
{
color: #FF0000;
text-decoration: underline;
}

#MainContent a:hover
{
color: #FFA500;
text-decoration: underline;
}

And here is the default.aspx file:

<head runat="server">
<title></title>

<link href="Styles/Styles.css" rel="stylesheet" type="text/css" />

</head>
<body>
<form id="form1" runat="server">
<div id="PageWrapper">
<div id="Header">Header Goes Here</div>
<div id="MenuWrapper">Menu Goes Here</div>
<div id="MainContent"></div>
<h1>
Hi there visitor and welcome to Planet Wrox</h1>
<p class="Introduction">
We're glad you're paying a visit to
<a href="http://www.PlanetWrox.com">www.PlanetWrox.com</a>, the coolest music
community on the internet.</p>
<p class="Introduction">
Feel free to have a <a href="Default.aspx">look around</a>; there are lots of interesting <strong>reviews
and concert pictures</strong> to be found here.</p>

<div id="Sidebar">Sidebar Goes Here</div>
<div id="Footer">Footer Goes Here</div>
</div>
</form>
</body>
</html>

Thanks for your help.

Imar · June 28th, 2015, 02:46 PM

Take a look at this:

<div id="MainContent"></div>

You're closing the MainContent div too early and thus none of the styles that use MainContent are applied to you content and links.

Move the div down to just before the SideBar and it should wok.

Cheers

Imar

Timmy24 · June 29th, 2015, 12:27 PM

Thats fixed it! And it fixed another problem with the sidebar. Thanks a lot Imar.