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
    Member tlcook's Avatar
    Join Date
    Nov 2006
    Posts
    38
    Member #
    14386
    Hey, I'm designing something new and fresh for a change, and I was fine until I added in something new at the top of the page.

    Now the layout has totally messed up and I can't find the problem

    I want the title and logo as they are. But the text underneath should be underneath the title and the links under the logo.

    Also, the links should be the same width, defined in the CSS file with 'width:75px;', but they aren't Why?

    The page so far: http://www.tlcook.com/tlc
    The CSS file: http://www.tlcook.com/tlc/style.css

    For the problem I am talking about, view the page in Firefox only. Because I have different stylesheets for different browsers (that fixed a different problem).

    EDIT: Layout fixed.

  2.  

  3. #2
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    I want to add that it's a bad idea to have different style
    sheets for different browsers (in my opinion anyhow).

    You will forever by fighting revision problems now that
    you're rendering your pages based on browsers.

    Design your site with one CSS style sheet for FireFox and
    then make it work for IE.

    Yes, more people use IE, but FireFox more closely follows the standards.


  4. #3
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    If nothing else, use one stylesheet for Firefox and for IE, and then maybe include an additional stylesheet to apply IE hacks, included via a conditional IE include.

    Remember, one of the best principles to follow in the world of programming is DRY -- Don't Repeat Yourself.

  5. #4
    Senior Member Steax's Avatar
    Join Date
    Dec 2006
    Location
    Bandung, Indonesia
    Posts
    1,207
    Member #
    14572
    True. One of the main ideas of CSS is that updating becomes really easy - one change and your site changes entirely to everyone. Having multiple stylesheets defeats this purpose. If you want, make one for "correct" browsers (Firefox, opera etc), and apply the CSS IE hacks in the same file. I'm sure your original problem was one on the box model - well, there are hacks on that everywhere.
    Note on code: If I give code, please note that it is simply sample code to demonstrate an effect. It is not meant to be used as-is; that is the programmer's job. I am not responsible to give you support or be held liable for anything that happens when using my code.

  6. #5
    Member tlcook's Avatar
    Join Date
    Nov 2006
    Posts
    38
    Member #
    14386
    Thanks for your ideas. I know having different stylesheets for different browsers isn't good practice, but it solved my problem for the time being. I am too new to CSS to get it right first time :P

    I am confused as to why things look better in IE than Firefox and Opera! The navigation links on the right should have a fixed width, but it only shows that in IE. Any ideas on that?

  7. #6
    Senior Member raspberryh's Avatar
    Join Date
    Aug 2004
    Location
    Erie, PA
    Posts
    882
    Member #
    7208
    Liked
    1 times
    If you're not getting your fixed width for your nav links, try using display: block for them. I don't see any display property in your stylesheet for the nav.
    choosy developers choose gif!
    website | paintings | blog


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