I recently changed over some of the CSS on my page and it is

Question

0

Asked: June 13, 20262026-06-13T07:41:35+00:00 2026-06-13T07:41:35+00:00

I recently changed over some of the CSS on my page and it is

0

I recently changed over some of the CSS on my page and it is making the body small and the footer huge so I am trying to delete the footer in the layout and the CSS but no luck. I have gone through it a couple of times and can’t seem to figure it out. Any advice let me know.

_Layout.cshtml

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <script type="text/javascript" src="@Url.Content("~/Scripts/jquery-1.7.1.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")"></script>
    <title>@ViewBag.Title - My ASP.NET MVC Application</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
    <header>
        <div class="content-wrapper">
            <div class="float-left">
                <p class="site-title">@Html.ActionLink("ARPP Razor", "Index", "Home")</p>
            </div>
            <div class="float-right">
                <section id="login">
                    @Html.Partial("_LoginPartial")
                </section>
            </div>
                <nav>

                   <ul>
                        @*<li>@Html.ActionLink("Home", "Index", "Home")</li>*@
                        <li><a href="#">ARPP</a>
                            <ul>
                                <li>@Html.ActionLink("Genes", "Genes", "Home")</li>
                                <li>@Html.ActionLink("Clones","Clones","Home")</li>
                            </ul>
                        </li>
                        <li><a href="#">File Management</a>
                            <ul>
                            <li>@Html.ActionLink("Upload", "Upload", "FileManagement")</li>
                            <li>@Html.ActionLink("Create File", "CreateFile", "FileManagement")</li>
                            <li>@Html.ActionLink("File to Fasta", "FileToFasta", "FileManagement")</li>
                            </ul>
                        </li>
                    </ul>
                </nav>

        </div>
    </header>
    <div id="body">

        <section class="content-wrapper main-content clear-fix">
            @RenderBody()
        </section>
    </div>


    @Scripts.Render("~/bundles/jquery")
    @RenderSection("scripts", required: false)
</body>

and site.css

nav {
margin: 20px auto; 
text-align: center;
}

nav ul ul {
display: none;
}

nav ul li:hover > ul {
    display: block;
}


nav ul {
background: #efefef; 
background: linear-gradient(top, #efefef 0%, #bbbbbb 100%);  
background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%); 
background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%); 
box-shadow: 0px 0px 9px rgba(0,0,0,0.15);
padding: 0 0px;
border-radius: 100px;  
list-style: none;
position: relative;
display: inline-table;
}
nav ul:after {
    content: ""; clear: both; display: block;
}

nav ul li {
    float: left;
}
    nav ul li:hover {
        background: #4b545f;
        background: linear-gradient(top, #4f5964 0%, #5f6975 40%);
        background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%);
        background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%);
    }
        nav ul li:hover a {
            color: #fff;
        }

    nav ul li a {
        display: block; padding: 25px 40px;
        color: #757575; text-decoration: none;
    }


nav ul ul {
    background: #5f6975; border-radius: 0px; padding: 0;
    position: absolute; top: 100%;
}
    nav ul ul li {
        float: none; 
        border-top: 1px solid #6b727c;
        border-bottom: 1px solid #575f6a; position: relative;
    }
        nav ul ul li a {
            padding: 15px 40px;
            color: #fff;
        }   
            nav ul ul li a:hover {
                background: #4b545f;
            }

nav ul ul ul {
    position: absolute; left: 100%; top:0;
}

/* tables
----------------------------------------------------------*/
table {
border-collapse: collapse;
border-spacing: 0;
margin-top: 0.75em;
border: 0 none;
}

th {
font-size: 1.2em;
text-align: left;
border: none 0px;
padding-left: 0;
}

th a {
    display: block;
    position: relative;
}

th a:link, th a:visited, th a:active, th a:hover {
    color: #333;
    font-weight: 600;
    text-decoration: none;
    padding: 0;
}

th a:hover {
    color: #000;
}

th.asc a, th.desc a {
    margin-right: .75em;
}

th.asc a:after, th.desc a:after {
    display: block;
    position: absolute;
    right: 0em;
    top: 0;
    font-size: 0.75em;
}

th.asc a:after {
    content: '▲';
}

th.desc a:after {
    content: '▼';
}

td {
padding: 0.25em 2em 0.25em 0em;
border: 0 none;
}

tr.pager td {
padding: 0 0.25em 0 0;
}

aside {
float: right;
width: 25%;
}

aside ul {
    list-style: none;
    padding: 0;
}

    aside ul li {
        background: url("../Images/bullet.png") no-repeat 0 50%;
        padding: 2px 0 2px 20px;
    }

.label {
font-weight: 700;
}

/* login page */
#loginForm {
border-right: solid 2px #c8c8c8;
float: left;
width: 55%;
}

#loginForm .validation-error {
    display: block;
    margin-left: 15px;
}

#loginForm .validation-summary-errors ul {
    margin: 0;
    padding: 0;
}

#loginForm .validation-summary-errors li {
    display: inline;
    list-style: none;
    margin: 0;
}

#loginForm input {
    width: 250px;
}

#loginForm input[type="checkbox"],
#loginForm input[type="submit"],
#loginForm input[type="button"],
#loginForm button {
    width: auto;
}

#socialLoginForm {
margin-left: 40px;
float: left;
width: 40%;
}

#socialLoginForm h2 {
    margin-bottom:  5px;
}

#socialLoginList button {
margin-bottom: 12px;
}

#logoutForm {
display: inline;
}

/* contact */
.contact h3 {
font-size: 1.2em;
}

.contact p {
margin: 5px 0 0 10px;
}

.contact iframe {
border: 1px solid #333;
margin: 5px 0 0 10px;
}

/* forms */
fieldset {
border: none;
margin: 0;
padding: 0;
}

fieldset legend {
    display: none;
}

fieldset ol {
    padding: 0;
    list-style: none;
}

    fieldset ol li {
        padding-bottom: 5px;
    }

label {
display: block;
font-size: 1.2em;
font-weight: 600;
}

label.checkbox {
display: inline;
}

input, textarea {
border: 1px solid #e2e2e2;
background: #fff;
color: #333;
font-size: 1.2em;
margin: 5px 0 6px 0;
padding: 5px;
width: 300px;
}

textarea {
font-family: inherit;
width: 500px;
}

input:focus, textarea:focus {
    border: 1px solid #7ac0da;
}

input[type="checkbox"] {
    background: transparent;
    border: inherit;
    width: auto;
}

input[type="submit"],
input[type="button"],
button {
    background-color: #d3dce0;
    border: 1px solid #787878;
    cursor: pointer;
    font-size: 1.2em;
    font-weight: 600;
    padding: 7px;
    margin-right: 8px;
    width: auto;
}

td input[type="submit"],
td input[type="button"],
td button {
    font-size: 1em;
    padding: 4px;
    margin-right: 4px;
}

/* info and errors */
.message-info {
border: 1px solid;
clear: both;
padding: 10px 20px;
}

.message-error {
clear: both;
color: #e80c4d;
font-size: 1.1em;
font-weight: bold;
margin: 20px 0 10px 0;
}

.message-success {
color: #7ac0da;
font-size: 1.3em;
font-weight: bold;
margin: 20px 0 10px 0;
}

.error {
color: #e80c4d;
}

/* styles for validation helpers */
.field-validation-error {
color: #e80c4d;
font-weight: bold;
}

.field-validation-valid {
display: none;
}

input.input-validation-error {
border: 1px solid #e80c4d;
}

input[type="checkbox"].input-validation-error {
border: 0 none;
}

.validation-summary-errors {
color: #e80c4d;
font-weight: bold;
font-size: 1.1em;
}

.validation-summary-valid {
display: none;
}


/* content */
article {
float: left;
width: 70%;
}

/* page elements
----------------------------------------------------------*/
/* featured 
.featured {
background-color: #fff;
}

.featured .content-wrapper {
    background-color: #7ac0da;
    background-image: -ms-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
    background-image: -o-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0,    #7ac0da), color-stop(1, #a4d4e6));
    background-image: -webkit-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
    background-image: linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
    color: #3e5667;
    padding: 20px 40px 30px 40px;
}

    .featured hgroup.title h1, .featured hgroup.title h2 {
        color: #fff;
    }

    .featured p {
        font-size: 1.1em;
    }

 /* page titles */
hgroup.title {
margin-bottom: 10px;
}

hgroup.title h1, hgroup.title h2 {
display: inline;
}

hgroup.title h2 {
font-weight: normal;
margin-left: 3px;
}

/* features 
section.feature {
width: 300px;
float: left;
padding: 10px;
}


/* login
----------------------------------------------------------*/
#login {
display: block;
font-size: .85em;
margin: 0 0 10px;
text-align: right;
}

#login a {
    background-color: #d3dce0;
    margin-left: 10px;
    margin-right: 3px;
    padding: 2px 3px;
    text-decoration: none;
}

#login a.username {
    background: none;
    margin: 0;
    padding: 0;
    text-decoration: underline;
}

#login ul {
    margin: 0;
}

#login li {
    display: inline;
    list-style: none;
}
/* main layout
----------------------------------------------------------*/
.content-wrapper {
margin: 0 auto;
max-width: 960px;
}

#body {
background-color: #efeeef;
clear: both;
padding-bottom: 0px;
}

.main-content {
    background: url("../Images/accent.png") no-repeat;
    padding-left: 10px;
    padding-top: 30px;
}

.featured + .main-content {
    background: url("../Images/heroAccent.png") no-repeat;
}



footer {
clear: both;
background-color: #e2e2e2;
font-size: .8em;
height: 100px;
}


/* site title
----------------------------------------------------------*/
.site-title {
color: #c8c8c8;
font-family: Rockwell, Consolas, "Courier New", Courier, monospace;
font-size: 2.3em;
margin: 0;
}

.site-title a, .site-title a:hover, .site-title a:active {
background: none;
color: #c8c8c8;
outline: none;
text-decoration: none;
}

.webGrid {margin: 4px; border-collapse: collapse; width: 300px;}
.header {background-color: #E8E8E8; font-weight: bold; color: #FFF;}
.webGrid th. .webGrid td {border: 1px solid #C0C0C0; padding: 5px;}
.alt{background-color: #E8E8E8; color: #000;}
.person{ width:200px; font-weight:bold;} 

html {
background-color: #e2e2e2;
margin: 0;
padding: 0;
}

.spacing{
height: 20px;
}

body {
background-color: #fff;
border-top: solid 10px #000;
color: #333;
font-size: .85em;
font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;
margin: 0;
padding: 0;
}

a {
color: #333;
outline: none;
padding-left: 3px;
padding-right: 3px;
text-decoration: underline;
}

a:link, a:visited,
a:active, a:hover {
    color: #333;
}

a:hover {
    background-color: #c7d1d6;
}

header, footer, hgroup,
nav, section {
display: block;
}

mark {
background-color: #a6dbed;
padding-left: 5px;
padding-right: 5px;
}

.float-left {
float: left;
}

.float-right {
float: right;
}

.clear-fix:after {
content: ".";
clear: both;
display: block;
height: 0;
visibility: hidden;
}

h1, h2, h3,
h4, h5, h6 {
color: #000;
margin-bottom: 0;
padding-bottom: 0;
}

h1 {
font-size: 2em;
}

h2 {
font-size: 1.75em;
}

h3 {
font-size: 1.2em;
}

h4 {
font-size: 1.1em;
}

h5, h6 {
font-size: 1em;
}

h5 a:link, h5 a:visited, h5 a:active {
    padding: 0;
    text-decoration: none;
}

Any changes to my CSS file to make the body regular sized and the footer small are greatly appreciated. Thanks!

Report

Leave an answer
Cancel reply

You must login to add an answer.

Need An Account,

1 Answer

Editorial Team · Answer 1 · 2026-06-13T07:41:36+00:00

Editorial Team

2026-06-13T07:41:36+00:00Added an answer on June 13, 2026 at 7:41 am

It looks like you aren’t using a <footer> element to delimit your site’s footer. If you do, it’d be trivial to define new CSS styles that apply exclusively to footer content.

0

Reply
Share
Share

- Report

Sign Up

Sign In

Forgot Password

The Archive Base Latest Questions

I recently changed over some of the CSS on my page and it is

Leave an answerCancel reply

1 Answer

Leave an answer
Cancel reply