Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    May 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    DREAMWEAVER CS4 Css Spry Menu problem.

    Hi guys and gals.


    I was trying to make the menu not float to the second line when the browser window was on a smaller screen size 800x600 from 1024 x ? anyways the new code I put in made the drop down band link go to the center of the menu as seen here.

    http://www.austincreativegroup.com

    Here is the CSS


    CSS

    html, body { margin: 0; padding: 0 }
    body { background-color:#999; }
    #container { margin: 0em auto 0 0em; padding-bottom: 0em; background-color: #999; }
    #month { border-collapse: collapse; margin-left: 0em; }
    #month th, #month td { border: 1px solid #000; }
    #month thead { background-color:#999; }
    #month td { width: 1em; height: 6em; padding: .2em; vertical-align: top; overflow: auto; }
    td .day {
    width: 6.92em;
    height: 10em;
    overflow:auto;
    margin-top: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    }
    #month tbody .weekend { background-color:#999; }
    #month tbody .next, #month tbody .previous { background-color:#999; }
    .rtop { display:block; background:#999; }
    .rtop * { display: block; height: 1px; overflow: hidden; background:#fff; }
    .r1{margin: 0 0 0 5px}
    .r2{margin: 0 0 0 3px}
    .r3{margin: 0 0 0 2px}
    .r4{margin: 0 0 0 1px; height: 1px}
    #container h1 { margin: 0 0 .5em .5em; font: 2em Arial, Helvetica, sans-serif; color: #999; }
    #month th { font: 1em bold Arial, Helvetica, sans-serif; }
    p {margin-top: 0; }

    body {
    margin: 0px;
    padding: 0px;
    background: #000 url(images/img01.jpg) repeat-x left top;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    }

    h1, h2, h3 {
    margin: 0;
    padding: 0;
    font-weight: normal;
    color: #D17522;
    }

    h1 {
    font-size: 2em;
    }

    h2 {
    font-size: 1em;
    color: #000;
    text-align: left;
    }

    h3 {
    font-size: 1.6em;
    }

    p, ul, ol {
    margin-top: 0;
    line-height: 180%;
    background: #FFF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #936;
    }

    ul, ol {
    color: #000;
    background: #000;
    }

    a {
    text-decoration: none;
    color: #ffcc66;
    }

    a:hover {
    color: #FC0;
    }

    #wrapper {
    width: 780px;
    margin: 0 auto;
    padding: 0;
    background: url(images/img08.jpg) no-repeat left top;
    }

    /* Header */

    #header {
    width: 780px;
    height: 125px;
    margin: 0 auto;
    }

    /* Logo */

    #logo {
    float: left;
    margin: 0;
    padding-top: 20px;
    color: #000000;
    font-family: Arial, Helvetica, sans-serif;
    }

    #logo h1, #logo p {
    margin: 0;
    padding: 0;
    }

    #logo h1 {
    float: left;
    letter-spacing: -1px;
    text-transform: lowercase;
    font-size: 3.8em;
    }

    #logo p {
    float: left;
    margin: 0;
    padding: 26px 0 0 10px;
    font: normal 14px Georgia, "Times New Roman", Times, serif;
    font-style: italic;
    color: #000;
    }

    #logo a {
    border: none;
    background: #FFF url(none);
    text-decoration: none;
    color: #000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1em;
    }

    /* Search */

    #search {
    float: right;
    width: 280px;
    height: 60px;
    padding: 20px 0px 0px 0px;
    background: #567EDC;
    border-bottom: 4px solid #FFFFFF;
    }

    #search form {
    height: 41px;
    margin: 0;
    padding: 10px 0 0 20px;
    }

    #search fieldset {
    margin: 0;
    padding: 0;
    border: none;
    }

    #search-text {
    width: 170px;
    padding: 6px 5px 2px 5px;
    border: none;
    background: #FFFFFF;
    text-transform: lowercase;
    font: normal 11px Arial, Helvetica, sans-serif;
    color: #5D781D;
    }

    #search-submit {
    width: 50px;
    height: 23px;
    border: 1px solid #A3C0FF;
    background: #A3C0FF;
    font-weight: bold;
    font-size: 10px;
    color: #246DFF;
    }

    /* Menu */

    #menu {
    width: 940px;
    height: 49px;
    margin: 0 auto;
    padding: 0;
    }

    #menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
    line-height: normal;
    }

    #menu li {
    float: left;
    }

    #menu a {
    display: block;
    width: 155px;
    height: 33px;
    padding-top: 16px;
    text-decoration: none;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: bold;
    color: #FFFFFF;
    border: none;
    }

    #menu a:hover, #menu .current_page_item a {
    background: #659CEF url(images/img03.jpg) repeat-x left bottom;
    text-decoration: none;
    }

    #menu .current_page_item a {
    background: #FBFBFC url(images/img02.jpg) repeat-x left bottom;
    padding-left: 0;
    color: #30476A;
    }

    /* Page */

    #page {
    width: 940px;
    margin: 0 auto;
    padding: 0;
    }

    #page-bgtop {
    padding: 20px px;
    }

    #page-bgbtm {
    font-family: Arial, Helvetica, sans-serif;
    color: #FFF;
    font-size: 12px;
    height: 0px;
    padding: 0px;
    }

    /* Content */

    #content {
    float: left;
    width: 620px;
    padding: 190px 0px 0px 0px;
    }

    .post {
    margin-bottom: 15px;
    }

    .post-bgtop {
    }

    .post-bgbtm {
    }

    .post .title {
    margin-bottom: 10px;
    padding: 12px 0 0 0px;
    letter-spacing: -.5px;
    color: #000000;
    background: #FFF;
    }

    .post .title a {
    color: #32639A;
    border: none;
    }

    .post .meta {
    height: 30px;
    background: #D8E7FE;
    margin: 0px;
    padding: 0px 0px 0px 0px;
    text-align: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: bold;
    }

    .post .meta .date {
    float: left;
    height: 24px;
    padding: 3px 15px;
    color: #4A81DE;
    }

    .post .meta .posted {
    float: right;
    height: 24px;
    padding: 3px 15px;
    background: #567EDC;
    color: #FFFFFF;
    }

    .post .meta a {
    color: #FFFFFF;
    }

    .post .entry {
    padding: 0px 0px 20px 0px;
    padding-bottom: 20px;
    text-align: justify;
    color: #333;
    background: #FFF;
    font-size: 16px;
    font-weight: normal;
    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
    }

    .links {
    padding-top: 20px;
    font-size: 12px;
    font-weight: bold;
    }

    /* Sidebar */

    #sidebar {
    float: right;
    width: 200px;
    color: #787878;
    padding: 0px;
    height: 0px;
    }

    #sidebar ul {
    margin: 0;
    padding: 0;
    list-style: none;
    }

    #sidebar li {
    margin: 0;
    padding: 0;
    border-left: 1px solid #FFFFFF;
    color: #000;
    background: #FFF;
    }

    #sidebar li ul {
    margin: 0px 0px;
    padding-bottom: 30px;
    }

    #sidebar li li {
    line-height: 35px;
    border-bottom: 1px dashed #D1D1D1;
    margin: 0px 30px;
    border-left: none;
    }

    #sidebar li li span {
    display: block;
    margin-top: -20px;
    padding: 0;
    font-size: 11px;
    font-style: italic;
    }

    #sidebar h2 {
    height: 38px;
    padding-left: 30px;
    letter-spacing: -0.5px;
    font-size: 1.8em;
    background: #FFF;
    color: #000;
    }

    #sidebar p {
    margin: 0 0px;
    padding: 0px 30px 20px 30px;
    text-align: justify;
    }

    #sidebar a {
    border: none;
    }

    #sidebar a:hover {
    text-decoration: underline;
    color: #000;
    }

    /* Calendar */

    #calendar {
    }

    #calendar_wrap {
    padding: 10px;
    }

    #calendar table {
    }

    #calendar tbody td {
    text-align: center;
    }

    #calendar #next {
    text-align: justify;
    }

    /* Footer */

    #footer {
    height: 50px;
    margin: 0 auto;
    padding: 0px 0 15px 0;
    background: #D8E7FE;
    border-top: 1px solid #D3DEF0;
    font-family: Arial, Helvetica, sans-serif;
    }

    #footer p {
    margin: 0;
    padding-top: 20px;
    line-height: normal;
    font-size: 10px;
    text-transform: uppercase;
    text-align: center;
    color: #A0A0A0;
    background: #000;
    }

    #footer a {
    color: #66666E;
    height: 10px;
    padding: 0px;
    width: 100%;
    margin: 0px;
    letter-spacing: 0.1em;
    word-spacing: 0.1em;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 9px;
    font-weight: lighter;
    font-style: italic;
    }

    #gallery-background {
    width: 620px;
    height: 370px;
    margin-bottom: 10px;
    background: url(images/logo.jpg) no-repeat left top;
    }

    #gallery-bgthumb {
    width: 620px;
    height: 0px;
    background: #DBEDF9;
    }

    #gallery
    {
    width: 620px;
    margin: 0 auto;
    height: 350px;
    padding: 0px;
    }

    #gallery img.output
    {
    width: 600px;
    height: 340px;
    padding: 10px 0px 0px 10px;
    }

    #gallery span.caption
    {
    display: block;
    margin: 1em 0 0 0;
    font-weight: bold;
    font-size: 1.25em;
    }

    #gallery span.caption2
    {
    margin: 1em 0 1em 0;
    display: block;
    }

    #gallery ul.nav
    {
    width: 100%;
    list-style: none;
    margin: 0 0 3em 0;
    padding: 0;
    }

    #gallery ul.nav li
    {
    margin: 0 1em 1em 0;
    float: left;
    }

    #gallery ul.thumbnails
    {
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 5px 0px 0px 6px;
    }

    #gallery ul.thumbnails li
    {
    margin: 0 0.5em 1em 0.5em;
    float: left;
    }

    #gallery ul.thumbnails li img
    {
    width: 108px;
    height: 88px;
    border: solid 6px #FFFFFF;
    cursor: pointer;
    }

    #gallery ul.thumbnails li img.active
    {
    border: solid 5px #77D0EF;
    }
    .twoColElsLtHdr #container table tr td table tr td table tr td p {
    text-align: justify;
    color: #666;
    }



    PLEASE HELP ME OUT

    Shaun

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello Riddle143,
    Set a width on your ul, like this
    Code:
    ul.MenuBarHorizontal
    {
    	margin: 0;
    	padding: 0;
    	list-style-type: none;
    	font-size: 100%;
    	cursor: default;
    	width: 768px;
    	height: auto;
    	font-family: Arial, Helvetica, sans-serif;
    	font-weight: normal;
    	color: #FFF;
    	background: #999;
    }
    You have some divitis there ... for example, #munu isn't doing anything and is not styled in your CSS. Is it really necessary?
    You should read the link about tables in my signature line.

    When posting code in the forum, please use the code tags, [code][/code] - available with the # button in the post edit window.
    This will wrap your code in a scroll box which greatly helps the readability of your post.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •