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 6 of 6
  1. #1
    Senior Member -chris-'s Avatar
    Join Date
    Apr 2006
    Location
    SK
    Posts
    1,205
    Member #
    13102
    Why, you ask? Because I can never seem to get them to work.

    Here is my CSS:
    Code:
    body { background-image: url(bg.jpg); margin: 0; padding: 0; }
    #contents { margin: 0 auto; background-color: #99ac90; width: 750px; border-right: 15px #f7843d; border-left: 15px #f7843d; }
    #logo { width: 100%; }
    #nav { width: 100%; padding: 10px; }
    #text { width: 100%; padding: 10px; }
    #foot { width: 100%; margin: 0 auto; padding: 10px; }
    Here is my HTML:
    HTML Code:
    <div id="contents">
    <div id="logo">
    <img src="veritaswebdesign.jpg" alt="" width="750" height="157" />
    </div>
    <div id="nav">
    NAVIGATION
    </div>
    <div id="text">
    <p>Lorem ipsum</p>
    </div>
    <div id="foot">
    <p class="style3" align="center">&copy;2006 - Veritas Web Design</p>
    </div>
    </div>
    What am I doing wrong? I have tried rearranging damn near everything to get them to work, but it isn't working for me.
    Portfolio | Blog | Twitter

    Was my post, or someone elses, helpful? Click the thumbs up to let everyone know!

  2.  

  3. #2
    Senior Member -chris-'s Avatar
    Join Date
    Apr 2006
    Location
    SK
    Posts
    1,205
    Member #
    13102
    Here is how I fixed the problem:
    Code:
    #contents { margin: 0 auto; background-color: #99ac90; width: 750px; border-left: solid 10px #f7843d; border-right: solid 10px #f7843d; }
    Portfolio | Blog | Twitter

    Was my post, or someone elses, helpful? Click the thumbs up to let everyone know!

  4. #3
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    Sure enough, borders take three directives: style, color, and width. I wasn't aware they could be in a strange order like yours; generally speaking, the order should be `width style color', so you could do [minicode]border: thin solid black;[/minicode]. You'll notice that also reads a little easier than [minicode]border: solid thin black;[/minicode] and far easier than [minicode]border: black solid thin;[/minicode] in terms of grammatical correctness.

    You can also set these individually:
    Code:
    border-left-style: solid;
    border-left-width: 10px;
    border-left-color: #f7843d;
    The shortcut is usually used, but sometimes you want a certain class to inherit all the properties from a container class except style, width, or color, in which case you can use the specific options.

  5. #4
    Senior Member -chris-'s Avatar
    Join Date
    Apr 2006
    Location
    SK
    Posts
    1,205
    Member #
    13102
    The reason they were out of order was because I just put the "solid" in there to see if it would fix the problem. Now if IE weren't a POS, I might start to make some progress.
    Portfolio | Blog | Twitter

    Was my post, or someone elses, helpful? Click the thumbs up to let everyone know!

  6. #5
    ljm
    ljm is offline
    Senior Member ljm's Avatar
    Join Date
    Aug 2006
    Location
    Manchester, England
    Posts
    284
    Member #
    13684
    Liked
    1 times
    IE may be bad but it can interpret CSS to a decent enough extent to display a border. In fact, most *basic* layouts work fine in IE.

  7. #6
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    Well, the most annoyances I run into with IE end up being in CSS nowadays. Javascript doesn't seem to be nearly the annoyance that it used to be for cross-browser compatibility.


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 03:12 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com