+ Reply to Thread
Results 1 to 4 of 4

Thread: Me again! Anyone there? Is my problem inheritance...?

  1. #1

    Default Me again! Anyone there? Is my problem inheritance...?

    I was under the impression that if you stuffed lots of CSS declarations in 'body',
    it was a 'catch all' and worked for everything on your page, unless you specified
    otherwise.This doesn't appear to be working for me. But I bet it's an obvious clanger
    to those in the know. If anyone is around to help (please) I will display my coding. Otherwise, I'll keep tinkering and shouting...

  2. #2

    Default

    Give us a look then!

  3. #3

    Default

    Oh sorry. Been out. Here it is!! All of it. (There's some odd stuff in here I know.) Good luck! And thanks for looking.
    HTML Code:
    /*
    bake CSS style sheet 
    */
    .wrapper
        {
        width: 850px;
        background-color: none;
        margin: 0 auto;
        
        }
    .bunting
        {
        background-image: url(6flags.gif);
        background-repeat: repeat;
        }
    #addressheader
        {
        font-size: 10px;
        float: right;
        color: purple;
        margin-top: 15px;
        }
    #offers
        {
        font-size: 20px;
        font-weight: bold;
        color: white;
        text-align: center;
        float: left;
        width: 200px;
        background: #BF6CA2;
        padding: 15px;
        margin: 15px;
        border: 5px solid white;
        }
    #branding
        {
        padding: 5px 10px;
        margin-top: 10px;
        float: right;
        border-color: solid purple;
        }
    #main-content
        {
        margin-top: 15px;
        margin-right: 10px;
        font-family: "Trebuchet MS", Geneva;
        color: purple;
        float: right;
        padding: 20px;
        width: 400px;
        background-color: #FAEFFB;
        border: 5px solid white;
        line-height: 1.6;
        }
    .picturelinks
        {
        font-family: "Trebuchet MS", Geneva;
        color: solid #7E446A;
        font-size: 15px;
        font-weight: bold;
        line-height: auto;
        
        }
    body    
        {
        font-family: "Century Gothic";
        color: solid #7E446A;
        border-left: 20px solid #7E446A; /*purple!*/
        border-right: 20px solid #7E446A;
        border-top: 20px solid #F8D6FF;
        border-bottom: 20px solid #F8D6FF;
        padding: 10 px;
        font-size: 14px;
        background-image: url(tablecloth.jpg);
        background-repeat: repeat;
        }
    ul
        {
        list-style: none;
        width: 250px;
        float: left;
        padding: 30px;
        color: solid purple;
        background-image: url(tinypinky.gif);
        background-image: repeat;
        border: 5px solid white;
        margin-left: 10px;
        }
    #party-offer
        {
        float: right;
        width: 400px;
        color: white;
        background: #BF6CA2;
        padding: 15px;
        margin: 15px;
        border: 5px solid white;
        }
    a:link
        {
        color: #9C2353;
        line-height: 1.5;
        }
    a:visited
        {
        color: #6394D7;
        border-bottom: 1px green;
        }
    a:hover
        {
        color: orange;
        background-color: pink;
        border-bottom: none;
        }
    a:active
        {
        color: teal;
        background-color: purple;
        border-bottom: none;
        }
    #footer
        {
        width: 800px;
        height: 50px;
        color: #CBF8FC;
        clear: both;
        }
    Here's my HTML.............................................. ........................
    HTML Code:
    </head>
    <body>
        <div class="bunting"><img src="6flags.gif" width= "216" height= "72" title="bunting"/>
        </div>
        
        <div class="wrapper">
        <img src="cakelogobig.jpg" width= "547" height= "169" title="Richardson's Specialist Baker logo" alt="" id="branding" />
            <div id="offers">Yummy 'BUY ONE GET ONE FREE'<br>offers in store!</div>
            <div id="addressheader">25 Market Street, Margate, Kent, CT9 5TW.</div>
                <div class="picturelinks"><!--all the photo navigation starts here-->
                    
                    <ul>
                    <h1>We specialise in...</h1><li><a href="sweets.html"><img src="cupcakes.jpg" width= "250" height= "188" title="cupcakes" alt="close-up of cupcakes on table"/></a>
                    <h2>sweets</h2>
                    </li>
                    <li><a href="savouries.html"><img src="breads.jpg" width= "250" height= "188" title="breads" alt="variety of breads"/></a>
                    <h2>savouries</h2>
                    </li>
                    <li><a href="special.html"><img src= "weddingcake2.jpg" width= "250" height= "282" title="wedding cake" alt="occasion cake with pink flowers"/></a>
                    <h2>special</h2>
                    </li>
                    </ul>
                </div>
        
        <div id="main-content">
            <p>Welcome to Richardson's freshly baked new website, created to give you access to our breads, cakes 
            and creations at the touch of a button. You can either view our delicacies, place an order and come 
            into our newly refurbished shop to collect for lunch, or have your goodies delivered thanks to our new 
            'man in the van' service. We may have changed our shop front but, rest assured, you can still rely on... 
            blah, blah...</p>
            <img src="cakeshoplogo.jpg" width= "200" height= "182" title="shopfront" alt= "Richardson's shop front" />
            <p>Find us here:
            <p><a href="bakemap.html">Map of Margate</a>
            </p>
            or call us on 01843 223562</p>
            <h3>Opening times:</h3>
            <p> Monday to Friday - 9am to 5.30pm </p>
            <p> Saturday - 8am to 6pm </p>
            <p> Sunday - closed
            </div> <!--main-content ends-->
        <div id="party-offer">
            <p>We host kids' birthday parties at Richardson's. Give your little one a party to remember, decorating 
            cupcakes with goodies galore! To book a special day call Baking Betty on 01843 220905.
            </p>        
            <div id="footer">
            <a href="index.html">Website creator's (ha ha!) page homepage</a>
            </div>
            </div><!--this closes the wrapper div-->
    </body>
    </html>

  4. #4

    Default

    Hi Alison. 2 things:
    1. Not all CSS properties are inherited - only some. See this neat presentation for more information on this and this cheat-sheet describing which properties are inherited and which are not.
    2. There are some syntax errors on your body declarations:

    HTML Code:
    body    
        {
        font-family: "Century Gothic";
        color: solid #7E446A;
        border-left: 20px solid #7E446A; /*purple!*/
        border-right: 20px solid #7E446A;
        border-top: 20px solid #F8D6FF;
        border-bottom: 20px solid #F8D6FF;
        padding: 10 px;
        font-size: 14px;
        background-image: url(tablecloth.jpg);
        background-repeat: repeat;
        }
    "solid" is not a valid value for color: see the CSS Reference for details.
    The space after "10" for padding: may cause problems.

    In most cases, browsers ignore declarations they don't understand so it's possible that these declarations are ignored, so fix those things first and then consider the inheritance issue.
    Perhaps late-night surfing is not such a waste of time after all: it is just the Web dreaming. Tim Berners-Lee
    Currently listening to: Script of the Bridge by The Chameleons

+ Reply to Thread

Similar Threads

  1. CSS Inheritance
    By David in forum Code
    Replies: 3
    Last Post: 28th Oct 2010, 01:22 pm
  2. The Problem with CSS is...
    By David in forum Code
    Replies: 0
    Last Post: 23rd Oct 2008, 12:42 pm
  3. Shu's IE problem
    By francis in forum Browsers and Software
    Replies: 1
    Last Post: 3rd Dec 2004, 12:57 pm

Bookmarks

Posting Permissions

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