Solved

StyleSheet For RenderPage and MVC 3

Posted on 2012-03-14
9
633 Views
Last Modified: 2012-03-16
Hi Experts!

Thanks for reading; this is for MVC 3.


Would like to apply the 'footer' style to the RenderPage (~/Shared/_footer.cshtml)

The stylesheet (~/Content/Site.css) has this:

body
{
    font-size: .85em;
    font-family: "Trebuchet MS", Verdana, Helvetica, Sans-Serif;
    color: #232323;
    background-color: #fff;
}

header,
nav,

footer
{
    padding: 5px;
    font-size: 8pt;
    text-align: center;
    background-color: #CCCCCC;
    font-weight: bold;
    margin-top: 30px;
}

Open in new window


The _footer.cshtml looks like this:

<div id="Footer">
    <div>
        Blah Blah</div>
    <div>
Blah Blah
        </div>
    <div>
        More Blah</div>
</div>

Open in new window


Any ideas?

TIA!
0
Comment
Question by:allanau20
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 4
9 Comments
 
LVL 15

Accepted Solution

by:
jorge_toriz earned 500 total points
ID: 37722832
Mmm... adding the following code before <div id="footer">

<link rel="stylesheet" type="text/css" href="@Url.Content("~/Content/site.css")" />
0
 
LVL 15

Expert Comment

by:jorge_toriz
ID: 37722834
And you must fix the footer selector of your css file:

#footer{ ... }
0
 
LVL 5

Author Comment

by:allanau20
ID: 37722888
Thanks jorge_toriz, added

<link rel="stylesheet" type="text/css" href="@Url.Content("~/Content/site.css")" />

Now it looks like this:

<link rel="stylesheet" type="text/css" href="@Url.Content("~/Content/site.css")" />

<div id="Footer">
    <div>
Blah Blah
        </div>
    <div>
        More Blah</div>
</div>

Open in new window


Got compiled error:

c:\Visual Studio 2010\Projects\Web\HelloWorld\HelloWorld\Shared\_footer.cshtml(2): error CS0103: The name 'Url' does not exist in the current context

Also, I don't see the '#' for the other sections? ie: Body.

The Site.css was created by default with VS 2010.
0
Salesforce Made Easy to Use

On-screen guidance at the moment of need enables you & your employees to focus on the core, you can now boost your adoption rates swiftly and simply with one easy tool.

 
LVL 15

Expert Comment

by:jorge_toriz
ID: 37724864
Change to:
<link rel="stylesheet" type="text/css" href="/Content/site.css" />

And you can't find the "#" character in body because body is a tag: <body>, but footer is an identifier <div id="footer">
0
 
LVL 5

Author Comment

by:allanau20
ID: 37726615
Thanks; I tried that, too and it didn't apply.

I've attached the files. Can please you try it out?

Here are the files:

/Content/Site.css
/Controllers/LoadCustomerAndDisplayController.cs
/Shared/_footer.cshtml
/Views/LoadCustomerAndDisplay/Index.cshtml

I"m unable to load '.cshtml' files; so I change it to '.txt'

Thanks again for your help!
files.zip
0
 
LVL 15

Expert Comment

by:jorge_toriz
ID: 37727459
I removed the header and nav elements of your css file:

body
{
    font-size: .85em;
    font-family: "Trebuchet MS", Verdana, Helvetica, Sans-Serif;
    color: #232323;
    background-color: #fff;
}

#footer
{
    padding: 35px;
    font-size: 28pt;
    text-align: center;
    background-color: #CCCCCC;
    font-weight: bold;
    margin-top: 30px;
}

Can you press Ctrl + F5 to refresh your browser cache?
0
 
LVL 5

Author Comment

by:allanau20
ID: 37727463
thanks; so everything is good. I will try it now.
0
 
LVL 5

Author Comment

by:allanau20
ID: 37727478
Style not applying.

1. Edit the css file
2. F5 from VS 2010
3. Browser shows up. Ctrl + F5
4. Go to page

Any ideas? Thanks!
0
 
LVL 15

Expert Comment

by:jorge_toriz
ID: 37730455
Can you post the HTML of your browser?, the result of the execution
0

Featured Post

Stressed Out?

Watch some penguins on the livecam!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…

707 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question