p2p.wrox.com Forums

p2p.wrox.com Forums (http://p2p.wrox.com/index.php)
-   BOOK: Beginning ASP.NET 4.5 : in C# and VB (http://p2p.wrox.com/forumdisplay.php?f=710)
-   -   Chapter 3: Trying Out the CSS Editor (http://p2p.wrox.com/showthread.php?t=93144)

mohamad June 24th, 2014 11:29 PM

Chapter 3: Trying Out the CSS Editor
 
Hi there,

Could not get "look around" link to turn to orange when mouse over the link.


Default.aspx

Code:


<%@ Page Language="VB" %>

<!DOCTYPE html>

<script runat="server">

    Protected Sub Page_Load(sender As Object, e As EventArgs)

    End Sub
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .auto-style1 {
            color: #990033;
        }
    </style>
    <link href="Styles/Styles.css" rel="stylesheet" type="text/css"/>
</head>
<body>
    <form id="form1" runat="server">
    <div id="PageWrapper">
        <header>Header Goes Here</header>
        <nav>Menu Goes Here</nav>
        <br />
        <section id="MainContent">
 
        <h1>Hi there visitor and welcome to Planet Wrox</h1>

        </section>
        <aside ="Sidebar">Sidebar Goes Here</aside>
      <br />
        <p>
            We're glad you're<span class="auto-style1"> paying a visit</span> to <a href="http://www.PlanetWrox.com">www.PlanetWrox.com</a>, the coolest music community site on the internet.

        </p>
       
        <p>
            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.

Styles.css

Code:


*
{
    font-family: Arial;
}

header {
    background-color: #C0C0C0;
    width: 844px;
    height: 86px;
}

h1 {
    font-size: 20px;
    padding: 0;
    margin: 0 0 10px 0;
}

.Introduction {
    font-style: italic;
    color: #003399;
}

#PageWrapper {
    width: 844px;
    margin: auto;
}

nav {
    width: 844px;
}

/*#region Main Content */

section#MainContent


{
    width: 664px;
    float: left;
}

section#MainContent a
{
    color: #4CFF00;
    text-decoration: underline;
}

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

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

/*#endregion*/

aside
{
    background-color: Gray;
    width: 180px;
    float: left;
}

footer {
    background-color: #C0C0C0;
    width: 844px;
    clear: both;
}

Cheers,
Mohamad

Imar June 25th, 2014 12:54 AM

Your paragraphs and links are outside your MainContent section element and are thus not affected by the styles. Move them into the section and it should work.

Cheers,

Imar


All times are GMT -4. The time now is 04:45 PM.

Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.