CodingForums.com - Header needs to be moved down on my site PLEASE HELP

CodingForums.com (http://www.codingforums.com/index.php)

- HTML & CSS (http://www.codingforums.com/forumdisplay.php?f=13)

- - Header needs to be moved down on my site PLEASE HELP (http://www.codingforums.com/showthread.php?t=286632)

Header needs to be moved down on my site PLEASE HELP

I am coding a child theme for a website using wordpress. I had changed some of the CSS to make the nav bar on the top stay fixed when scrolling. When I made those changes, the header moved up. how can I move the header down while also making it fixed and only have the body scroll. Thanks in advance. any help would be greatly appreciated

site:http://www.fillyshred.com/install

coding in the child theme style.css sheet thus far:

/*
Theme Name: Pink Touch 2- Child Theme
Description:
Author: admin
Template: pink-touch-2

(optional values you can add: Theme URI, Author URI, Version)
*/

@import url("../pink-touch-2/style.css");

body {
background: top center no-repeat;
color: #a22665;
font-size: 16px;
font-family: Arial, Times New Roman, Trebuchet MS;
margin: 0 auto 0;
padding: 0;
line-height: 20px;
}

/****************navbar**************/
#nav-menu {
display: block;
float: left;
color: #a22665;
font-size: 12px;
margin: -4px 0px 4px -16px;

}

#navigation{position:fixed;z-index:1}
#navigation-frill{position:fixed;z-index:2;margin-top:25px}

Hello brittanylynn01,
You should probably put #navigatin outside of #wrapper. Then you can put a top margin on #wrapper so it clears the fixed nav above it.

Like this -

Code:

        <div id="navigation">

                        <div class="wrapper clearfix">

                                <div id="nav-menu" class="menu-home-container"><ul id="menu-home" class="menu"><li id="menu-item-36" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-36"><a href="http://www.fillyshred.com/install/about/">About</a></li>

<li id="menu-item-35" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-35"><a href="http://www.fillyshred.com/install/events/">Events</a></li>

<li id="menu-item-32" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-32"><a href="http://www.fillyshred.com/install/updates/">Updates</a></li>

<li id="menu-item-34" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-34"><a href="http://www.fillyshred.com/install/shredder-of-the-month-2/">Shredder of the Month</a></li>

<li id="menu-item-33" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-33"><a href="http://www.fillyshred.com/install/swag-brag/">Swag Brag</a></li>

<li id="menu-item-31" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-31"><a href="http://www.fillyshred.com/install/contact/">Contact</a></li>

</ul></div>                                <form method="get" id="searchfield" action="http://www.fillyshred.com/install/">

        <input name="s" onfocus="if ( this.value=='Search' ) this.value='';" onblur="if ( this.value=='' ) this.value='Search';" value="Search" type="text">

</form>                        </div>

                </div><!-- /#navigation -->

        <div id="wrapper">

        

                <div id="navigation-frill"></div>



                <div id="header">

                        <h1><a href="http://www.fillyshred.com/install/" title="" rel="home"></a></h1>

Code:

#wrapper {

        margin: 40px auto 0; /*adjust as needed*/

        padding-bottom: 60px;

        position: relative;

        text-align: left;

}