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 3 of 3
  1. #1
    New Coder
    Join Date
    Mar 2012
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Help with fixed background issue in weebly.

    I need help with my website i got the fixed background correct but it messes up my text boxes... or spaces whatever you call them. My website is here:

    http://nhd.weebly.com/weebly/main.php#

    When you scroll up or down you will see what i mean.

    The code i have for it right now is:

    [ICODE]


    * {
    margin:0;
    padding:0;
    }
    body {
    background: transparent url(http://www.ulpv.com/uploads/Catholic...-Wallpaper.jpg) repeat-x center top;
    background-attachment: fixed;
    background-color:#0d1216;
    font-family:Georgia,"times new roman",serif;
    font-size:13px;
    color:#4f7288;
    margin:0;
    padding:0;
    }
    p {
    line-height:1.5;
    padding-bottom: 12px;
    }
    h1 {
    font-family:Georgia,"times new roman",serif;
    font-size:20px;
    font-weight:normal;
    color:#fff;
    line-height:1.5;
    }
    h2 {
    font-family:Georgia,"times new roman",serif;
    font-size:18px;
    font-weight:normal;
    color:#ffffff;
    line-height:1.5;
    }
    #wrapper {
    width:960px;
    margin:0pt auto;
    }
    #sitename {
    width:960px;
    font-size:30px;
    padding: 14px 0 10px;
    }
    #sitename, #sitename a {
    color:#cccccc;
    font-weight:normal;
    }
    #content-wrapper {
    background:transparent url(content_background.jpg) repeat-x center top;
    background-attachment: fixed;
    float:left;
    width:960px;
    margin-top:9px;
    margin-right:0px;
    padding-bottom:25px;
    }
    #navigation {
    float:left;
    background-color:#0a161b;
    width:948px;
    font-size:12px;
    color:#060e11;
    padding:16px 0px 0 12px;
    }
    #navigation ul {
    float:left;
    padding:0 10px 0 0;
    margin:0;
    }
    #navigation li {
    float:left;
    display:inline;
    height:30px;
    font-size:1em;
    margin:0;
    padding:0px 20px 6px 10px;
    }
    #navigation a:link {
    color:#fff;
    text-decoration:none;
    }
    #navigation a:hover {
    color:#fff;
    text-decoration:none;
    }
    #navigation a:visited {
    color:#fff;
    text-decoration:none;
    }
    #active a:link {
    color:#63afde;
    text-decoration:none;
    }
    #active a:hover {
    color:#63afde;
    text-decoration:none;
    }
    #active a:visited {
    color:#63afde;
    text-decoration:none;
    }
    a:link, a:hover, a:visited {
    color:#63afde;
    font-weight:normal;
    text-decoration:none;
    }
    .weebly_header {
    background:transparent url(default_header.jpg) no-repeat center top;
    float:left;
    width:960px;
    height:314px;
    }
    #contents {
    width:920px;
    min-height:500px;
    height:auto !important;
    height:500px;
    padding:20px;
    }
    #footer {
    float:left;
    width:960px;
    margin:20px 0 30px 0;
    background-color:#0c1c23;
    }
    #footer-contents {
    float:left;
    font-family:Georgia,"times new roman",serif;
    padding:15px 20px 15px 20px;
    width:920px;
    }
    input {
    background-color:#394c5b;
    border:1px solid #999;
    font-size:12px;
    color:#000000;
    }
    textarea {
    background-color:#394c5b;
    border:1px solid #999;
    font-size:12px;
    color:#000000;
    }

    div#commentArea div.blogCommentOwner {
    background: #323242;
    border: 1px solid #505060;
    }


    /****************************** flyout menus ******************************/

    #weebly-menus .weebly-menu-wrap {
    z-index: 5000;
    }

    #weebly-menus .weebly-menu {
    padding: 0;
    margin: 0;
    list-style: none;
    }

    #weebly-menus .weebly-menu li {
    float: left;
    clear: left;
    width: 170px;
    text-align: left;
    }

    #weebly-menus .weebly-menu li a {
    position: relative;
    display: block;
    width: 100%;
    background: #2a3e4e;
    border-right: 1px solid #394c5b;
    border-left: 1px solid #394c5b;
    border-bottom: 1px solid #394c5b;
    text-decoration: none;
    font-size: 11px;
    font-weight: normal;
    line-height:1;
    padding:5px;
    color: #fff;
    }

    #weebly-menus .weebly-menu li a:hover {
    background: #2a3e4e;
    }

    #weebly-menus span.weebly-menu-title {
    display: block;
    padding: 5px 10px;
    }

    #weebly-menus span.weebly-menu-more {
    background: transparent url(http://images.weebly.com/weebly/imag...menu_arrow.gif) no-repeat center top;
    display: block;
    position: absolute;
    right: 5px;
    top: 0;
    font-family: Courier;
    height: 28px;
    line-height: 28px;
    padding:3px 0 3px 0;
    }

    [ICODE]

    I know the picture is too big too so could you tell me how to use a picture from your saved documents? Any help would be greatly appreciated.

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,084
    Thanks
    23
    Thanked 593 Times in 592 Posts
    When you post code use the '#' not the '#i'.
    Your link to your site is wrong, it takes me to the weebly log in screen.
    Can not see anything without the html mark up. Your css is worthless without it.

    BUT, lets talk about the body rule you have and the background image.
    Your image is large, that's good for what you want. Why did you use 'repeat-x '? No need for that at all. Let's get rid of that.
    The 'background' element allows us to put a number of things in it as a short cut. Some of what we can do you do as extra code 'background-attachment:' and 'background-color:' are part of the 'background' element; the rule transparent is not.
    Let's remove what don't belong and add what we can:
    Code:
    background: #0d1216 url('http://www.ulpv.com/uploads/Catholic-Church-Vatican-Wallpaper.jpg') center top fixed;
    Lastly
    Code:
    margin:0;
    padding:0;
    You have already set this in the * rule. delete that. New coding:
    Code:
    body {
    background: #0d1216 url('http://www.ulpv.com/uploads/Catholic-Church-Vatican-Wallpaper.jpg') center top fixed;
    font-family:Georgia,"times new roman",serif;
    font-size:13px;
    color:#4f7288;
    }
    Please post the HTML.

  • #3
    New Coder
    Join Date
    Mar 2012
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Oh actually yea i know i messed up and took the website editor URL instead of the rendered version of it. Thanks, the problem is mostly fixed but if you take a look at:

    http://28151677.nhd.weebly.com/index.html

    It cuts off towards the bottom and then the text has no blue background and then it cant be seen because it blends into the picture. Any way i can fix that? also how do i add a blue background to the title of page all the way at the top?

    Thats about the end of my problems but do you have any ideas to make my site cooler? nothing too flashy though.


  •  

    Posting Permissions

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