What am I doing wrong

Hey Everyone,
After getting some advice from Denise in the show us your site form I need someone's help. I am having a issue with my navbar where it gets cut off if the screen is certain sizes. I am using the dimension customizer that smugmug has so I'm not sure if that is what is causing this issue or not. I want it just stay in place when you change screen sizes no matter what browser or how big you have it. Can anyone help me on this issue? Also I am using a customize navbar as you'll probably be able to tell so I am using a html/css block. As many of you know and I say everytime I have any big problems I can't figure out I don't know code very well and I am very much a novice so please keep that in mind. Thanks in advance!

Here is the code so you don't have to go to my site. I used a navbar generator do make this code.( if you want to go there its www.k-ophotography.com)

[HTML]<div id="myBanner"></div>
<div id="cssmenu">
<ul>
<li><a href="http://www.k-ophotography.com"><span>Home</span></a></li&gt;
<li><a href="http://www.k-ophotography.com/Bio/Aboutme"><span>Bio</span></a></li&gt;
<li class="has-sub"><a href="http://www.k-ophotography.com/FineArt"><span>Fine Art</span></a>
<ul>
<li class="has-sub"><a href="http://www.k-ophotography.com/landscape/15021183_pGh8zz/"><span>Landscapes</span></a></li&gt;
<li class="has-sub"><a href="http://www.k-ophotography.com/Holga/15023800_tNjdpf/"><span>Holga</span></a></li&gt;
<li class="has-sub"><a href="http://www.k-ophotography.com/Miscellaneous/15066851_8LSFH2/"><span>Miscellaneous</span></a></li&gt;
</ul>
</li>
<li class="has-sub"><a href="http://www.k-ophotography.com/WeddingsandPortraitPhotography"><span>Weddings and Portraits</span></a>
<ul>
<li class="has-sub"><a href="http://www.k-ophotography.com/Weddings/21664399_STWJhf/"><span>Weddings</span></a></li&gt;
<li class="has-sub"><a href="http://www.k-ophotography.com/Portraits/21668501_QWfnXP/"><span>Portraits</span></a></li&gt;
</ul>
</li>
<li><a href="http://k-ophotography.blogspot.com/"><span>Blog</span></a></li&gt;
<li><a href="http://www.k-ophotography.com/Testimonials-"><span>Testimonials</span></a></li&gt;
<li><a href="http://www.k-ophotography.com/Client-Login-"><span>Clients</span></a></li&gt;
<li><a href="http://www.k-ophotography.com/Contact"><span>Contact</span></a></li&gt;
</ul>
</div>[/HTML]

/* Pure CSS3 Multi Level Drop Down Navigation Menu */
#cssmenu ul, #cssmenu li, #cssmenu span, #cssmenu a {
  margin: 0;
  padding: 0;
  position: relative;
}

#cssmenu {
  height: 49px;
  margin: 0px auto 75px;
  width: 720px;
  border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0;
  background: #141414;
  background: url(data:image/png;
  base64, iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALElEQVQImWMwMrJi+v//PxMDw3+m//8ZoPR/qBgDEhuXGLoeYswhXg8R5gAAdVpfoJ3dB5oAAAAASUVORK5CYII=) 100% 100%;
  background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
  background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
  background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
  background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
  background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
  border-bottom: 2px solid #0fa1e0;
}

#cssmenu:after, #cssmenu ul:after {
  content: '';
  display: block;
  clear: both;
}

#cssmenu a {
  background: #141414;
  background: url(data:image/png;
  base64, iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALElEQVQImWMwMrJi+v//PxMDw3+m//8ZoPR/qBgDEhuXGLoeYswhXg8R5gAAdVpfoJ3dB5oAAAAASUVORK5CYII=) 100% 100%;
  background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
  background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
  background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
  background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
  background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
  color: #ffffff;
  display: inline-block;
  font-family: Helvetica, Arial, Verdana, sans-serif;
  font-size: 12px;
  line-height: 49px;
  padding: 0 20px;
  text-decoration: none;
}

#cssmenu ul {
  list-style: none;
}

#cssmenu > ul {
  float: left;
}

#cssmenu > ul > li {
  float: left;
}

#cssmenu > ul > li:hover:after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 50%;
  bottom: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #0fa1e0;
  margin-left: -10px;
}

#cssmenu > ul > li:first-child > a {
  border-radius: 5px 0 0 0;
  -moz-border-radius: 5px 0 0 0;
  -webkit-border-radius: 5px 0 0 0;
}

#cssmenu > ul > li:last-child > a {
  border-radius: 0 5px 0 0;
  -moz-border-radius: 0 5px 0 0;
  -webkit-border-radius: 0 5px 0 0;
}

#cssmenu > ul > li.active a {
  box-shadow: inset 0 0 3px #000000;
  -moz-box-shadow: inset 0 0 3px #000000;
  -webkit-box-shadow: inset 0 0 3px #000000;
  background: #070707;
  background: url(data:image/png;
  base64, iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALklEQVQImWNQU9Nh+v//PxMDw3+m//8ZkNj/mRgYIHxy5f//Z0BSi18e2TwS5QG4MGB54HL+mAAAAABJRU5ErkJggg==) 100% 100%;
  background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
  background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
  background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
  background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
  background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
}

#cssmenu > ul > li:hover > a {
  background: #070707;
  background: url(data:image/png;
  base64, iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALklEQVQImWNQU9Nh+v//PxMDw3+m//8ZkNj/mRgYIHxy5f//Z0BSi18e2TwS5QG4MGB54HL+mAAAAABJRU5ErkJggg==) 100% 100%;
  background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
  background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
  background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
  background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
  background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
  box-shadow: inset 0 0 3px #000000;
  -moz-box-shadow: inset 0 0 3px #000000;
  -webkit-box-shadow: inset 0 0 3px #000000;
}

#cssmenu .has-sub {
  z-index: 1;
}

#cssmenu .has-sub:hover > ul {
  display: block;
}

#cssmenu .has-sub ul {
  display: none;
  position: absolute;
  width: 200px;
  top: 100%;
  left: 0;
}

#cssmenu .has-sub ul li {
  *margin-bottom: -1px;
}

#cssmenu .has-sub ul li a {
  background: #0fa1e0;
  border-bottom: 1px dotted #6fc7ec;
  filter: none;
  font-size: 11px;
  display: block;
  line-height: 120%;
  padding: 10px;
}

#cssmenu .has-sub ul li:hover a {
  background: #0c7fb0;
}

#cssmenu .has-sub .has-sub:hover > ul {
  display: block;
}

#cssmenu .has-sub .has-sub ul {
  display: none;
  position: absolute;
  left: 100%;
  top: 0;
}

#cssmenu .has-sub .has-sub ul li a {
  background: #0c7fb0;
  border-bottom: 1px dotted #6db2d0;
}

#cssmenu .has-sub .has-sub ul li a:hover {
  background: #095c80;
}