Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 9 of 9
  1. #1
    Member
    Join Date
    Mar 2014
    Posts
    46
    Member #
    38608

    hi im in need of help still please

    the css

    /*
    Theme Name: evansdesigns HTML5/CSS3 Layout template
    Date: March 2014
    Description: Basic HTML5/CSS3 layout built on a responsive framework
    Version: 1.0
    Author: Lee Evans
    Author URL: evansdesigns.net
    */

    /* ===========================
    ======= Body style Lee Evans ========
    =========================== */
    body {
    background-image: url(img/pic1.jpg)
    color: #000305;
    font-size: 87.5%; /* Base font size: 14px -- Lee Evans---*/
    font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    line-height: 1.429;
    margin: 0;
    padding: 0;
    text-align: left;
    }

    .body {background-image: url(file:///C|/Users/Lee/Desktop/my%20designs/img/pic1.jpg);
    background-repeat:no-repeat;
    background-size:100%;
    }
    /* ===========================
    ========= Headings Lee Evans ========
    =========================== */
    h2 {font-size: 1.571em} /* 22px */
    h3 {font-size: 1.429em} /* 20px */
    h4 {font-size: 1.286em} /* 18px */
    h5 {font-size: 1.143em} /* 16px */
    h6 {font-size: 1em} /* 14px */

    h2, h3, h4, h5, h6 {
    font-weight: 400;
    line-height: 1.1;
    margin-bottom: .8em;
    }

    /* ===========================
    ======= Lee Evans ======
    =========================== */
    a {
    outline: 0;
    }

    a img {
    border: 0px;
    text-decoration: none;
    }

    a:link, a:visited {
    color: #CF5C3F;
    padding: 0 1px;
    text-decoration: none;
    }

    a:hover, a:active {
    background-color: #CF5C3F;
    color: #fff;
    text-decoration: none;
    }

    /* ===========================
    ===== Main Navigation Lee Evans =====
    =========================== */

    .mainHeader nav {
    background: #666;
    font-size: 1.143em;
    height: 40px;
    line-height: 30px;
    margin: 0 auto 30px auto;
    text-align: center;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    }

    .mainHeader nav ul {
    list-style: none;
    margin: 0 auto;
    }

    .mainHeader nav ul li {
    float: left;
    display: inline;
    }

    .mainHeader nav a:link, .mainHeader nav a:visited {
    color: #fff;
    display: inline-block;
    height: 30px;
    padding: 5px 23px;
    text-decoration: none;
    }
    .mainHeader nav a:hover, .mainHeader nav a:active,
    .mainHeader nav .active a:link, .mainHeader nav .active a:visited {
    background: #CF5C3F;
    color: #fff;
    text-shadow: none !important;
    }

    .mainHeader nav li a {
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    }

    .mainHeader img {
    width: 30%;
    height: auto;
    margin: 3% 0;
    }

    /* ===========================
    ======= Content Area Lee Evans ======
    =========================== */

    .mainContent {
    overflow: hidden;
    line-height: 25px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    }

    .topcontent {
    background-color: #FFF;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 3% 5%;
    margin-bottom: 3%;
    }

    .bottomcontent {
    background-color: #FFF;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 3% 5%;
    }

    .content {
    width: 68%;
    float: left;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    }

    .post-info {
    font-style: italic;
    color: #999;
    font-size: 85%;
    }

    /* ===========================
    ======== Sidebar Lee Evans ==========
    =========================== */

    .top-sidebar {
    width: 24%;
    float: left;
    margin-left: 2%;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background-color: #FFF;
    padding: 2% 3%;
    margin-bottom: 2%;
    }

    .middle-sidebar {
    width: 24%;
    float: left;
    margin-left: 2%;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background-color: #FFF;
    padding: 2% 3%;
    margin-bottom: 2%;
    }

    .bottom-sidebar {
    width: 24%;
    float: left;
    margin-left: 2%;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background-color: #FFF;
    padding: 2% 3%;
    }

    /* ===========================
    ========= Footer Lee Evans ==========
    =========================== */

    .mainFooter {
    width: 100%;
    float: left;
    margin-top: 2%;
    margin-bottom: 2%;
    padding-left: 0;
    background-color: #666;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    color: #FFF;
    }

    .mainFooter p {
    width: 91%;
    margin: 2% auto;
    }

    /* ===========================
    ====== Media Queries Lee Evans ======
    =========================== */

    @media only screen and (min-width : 150px) and (max-width : 780px)
    {
    .body {
    clear: both;
    margin: 0 auto;
    width: 90%;
    font-size: 90%;
    }

    .mainHeader nav {
    background: #666;
    font-size: 1.143em;
    height: 160px;
    line-height: 30px;
    margin-bottom: 0;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    }

    .mainHeader nav ul {
    list-style: none;
    margin: 0 auto;
    padding-left: 0;
    }

    .mainHeader nav li {
    margin-left: 0 auto;
    width: 100%;
    }

    .mainHeader nav a:link, .mainHeader nav a:visited {
    color: #FFF;
    display: block;
    height: 30px;
    padding: 5px 0;
    text-decoration: none;
    }

    .mainHeader nav a:active,
    .mainHeader nav .active a:link, .mainHeader nav .active a:visited {
    background: #CF5C3F;
    color: #fff;
    text-shadow: none !important;
    }

    .mainHeader nav li a {
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;

    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    }

    .mainHeader img {
    width: 100%;
    height: auto;
    margin-bottom: 3%;
    }

    .mainContent {
    overflow: hidden;
    line-height: 25px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    margin-top: 4%;
    margin-bottom: 2%;
    }

    .topcontent {
    background-color: #FFF;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 2% 5%;
    margin-bottom: 4%;
    }

    .bottomcontent {
    background-color: #FFF;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 2% 5%;
    }

    .content {
    width: 100%;
    float: left;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    }

    .post-info {
    display: none;
    }

    .top-sidebar {
    width: 86%;
    float: left;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background-color: #FFF;
    margin-top: 4%;
    margin-left: 0;
    padding: 0 7%;
    margin-bottom: 0;
    }

    .top-sidebar p {
    width: 90%;
    }

    .middle-sidebar {
    width: 86%;
    float: left;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background-color: #FFF;
    margin-top: 4%;
    margin-left: 0;
    padding: 0 7%;
    margin-bottom: 0;
    }

    .middle-sidebar p {
    width: 90%;
    }

    .bottom-sidebar {
    width: 86%;
    float: left;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background-color: #FFF;
    margin-top: 4%;
    margin-left: 0%;
    padding: 0 7%;
    margin-bottom: 1%;
    }

    .bottom-sidebar p {
    width: 90%;
    }

    .mainFooter {
    width: 100%;
    float: left;
    margin: 2% 0;
    padding-left: 0;
    background-color: #666;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    color: #FFF;
    }

    .mainFooter p {
    width: 86%;
    margin: 2% auto;
    }
    }

    now it works fine running of me pc but when i put it onto my domain i get this..

    evansdesigns.net

    my pics and background image is not appearing what have i done wrong can someone please show me were in the code i have messed up thank you.. ill away a reply

  2.  

  3. #2
    Member
    Join Date
    Mar 2014
    Posts
    46
    Member #
    38608
    and this my html code
    heres my code

    <title>evansdesigns.net</title>
    <meta charset="utf-8" />


    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="css/style.css" rel="stylesheet" type="text/css" />
    </head>

    <body class="body" bgcolor="#FF0000">

    <header class="mainHeader">
    <img src="img/head_bckg2.jpg" width="1100" height="266" alt="">
    <nav><ul>
    <li class="active"><a href="#">Home</a></li>
    <li><a href="#">Portfolio</a></li>
    <li><a href="#">Blog</a></li>
    <li><a href="#">Contact</a></li>
    </ul></nav>
    </header>

    <div class="mainContent">
    <div class="content">
    <article class="topcontent">
    <header>
    <h2><a href="#" rel="bookmark" title="Permalink to this POST TITLE">Second article</a></h2>
    </header>

    <footer>
    <p class="post-info">x</p>
    </footer>


    <p>xxxxxxx </p>
    <p>xxxxx</p>
    </article>

    <article class="bottomcontent">
    <header>
    <h2><a href="#" rel="bookmark" title="Permalink to this POST TITLE">First post</a></h2>
    </header>

    <footer>
    <p class="post-info">xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
    <p class="post-info">xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
    <p class="post-info">xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
    <p class="post-info">xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
    <p class="post-info">xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
    <p class="post-info">xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>



    </footer>




    </article>
    </div>

    <aside class="top-sidebar">
    <article>
    <h2>Silurian Security</h2>
    <p><a href="silurian%20Security%20web%20site/index.html"><img src="img/pic2.jpg" width="100" height="100" alt="Silurian Security"></a></p>
    </article>
    </aside>

    <aside class="middle-sidebar">
    <article>
    <h2>Security cymry</h2>
    <p><a href="Securtiy%20Cumru%20Ltd/index.html"><img src="img/securitycymru.jpg" width="100" height="100" alt="Security Cymru"></a></p>
    </article>
    </aside>

    <aside class="bottom-sidebar">
    <article>
    <h2>Bottom Sidebar</h2>
    <p>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx </p>
    </article>
    </aside>
    </div>

    <footer class="mainFooter">
    <p>Copyright &copy; 2014 <a href="http://evansdesigns.net">evansdesigns.net</a></p>
    <p><a href="https://www.facebook.com/leea.evans.56" target="_blank">
    <img src="img/facebook.png" width="44" height="39" alt="facebook"></a>
    </p>
    </footer>

    </body>
    </html>

  4. #3
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,772
    Member #
    5580
    Liked
    723 times
    In your CSS, you have references to images like this:

    file:///C|/Users/Lee/Desktop/my%20designs/img/pic1.jpg

    You don't have that path or directory on your website.


  5. #4
    Member
    Join Date
    Mar 2014
    Posts
    46
    Member #
    38608
    how do i correct this please and thanks for your time really apprechiate this

  6. #5
    Member
    Join Date
    Mar 2014
    Posts
    46
    Member #
    38608
    i have adjusted this ,,,
    body {
    background-image: url(img/pic1.jpg)
    color: #000305;
    font-size: 87.5%; /* Base font size: 14px -- Lee Evans---*/
    font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    line-height: 1.429;
    margin: 0;
    padding: 0;
    text-align: left;
    }

    .body {background-image:url(images/pic1.jpg);
    background-repeat:no-repeat;
    background-size:100%;
    }
    /* =======================
    its stil not working ,, baffled...............???????

  7. #6
    Member
    Join Date
    Mar 2014
    Posts
    46
    Member #
    38608
    body {
    background-image: url(img/pic1.jpg)
    color: #000305;
    font-size: 87.5%; /* Base font size: 14px -- Lee Evans---*/
    font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    line-height: 1.429;
    margin: 0;
    padding: 0;
    text-align: left;
    }

    .body {background-image:url(img/pic1.jpg);
    background-repeat:no-repeat;
    background-size:100%;
    }

    sry thats done,, still not working???????????????????????????????????????

  8. #7
    Member
    Join Date
    Mar 2014
    Posts
    46
    Member #
    38608
    have uploaded now on dreamweaver they work but on the web no pics work also background not working can someone please correct n paste code so i can study were iv gone wrong please be much apprechiated thanks lee.

  9. #8
    Member
    Join Date
    Mar 2014
    Posts
    46
    Member #
    38608
    all done there buddy thank you if u c the other post i have some errors i cant place can u look and explaine please ty

  10. #9
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,772
    Member #
    5580
    Liked
    723 times
    Again, you have file path issues ...

    NOTE: Using spaces in directory and filenames is a bad idea. Use underscores _ instead of space.
    You can see why below ... links are broken because of your use of spaces.

    You've created a directory for testing your Silurian website:
    http://evansdesigns.net/silurian Security web site/

    Let's look at this line in your CSS file ...
    .body {background-image:url(img/pic1.jpg);

    Now, you're telling it go to the directory called 'img' and getting 'pic 1.jpg' ...
    http://evansdesigns.net/silurian Security web site/img/pic1.jpg

    Here's your problem ...
    The directory called 'img' does not exist in your Silurian test page.

    Here is where the image is really located:
    http://evansdesigns.net/img/pic1.jpg

    Make a copy of your 'img' directory within your 'silurian Security web site' directory.

    The CSS and HTML files need to know where your images are stored relative to their position (directory location).



Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 09:23 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com