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.

Page 1 of 3 1 2 3 LastLast
Results 1 to 10 of 23
  1. #1
    Senior Member
    Join Date
    Mar 2004
    Posts
    1,518
    Member #
    5220
    I've been having problems converting my site to a CSS layout and could do with a hand

    If you go to www.rednerve.com/test/index2.php then you can see what I have so far. If you look at that URL in IE, it displays fine, everything how I want it but, go to the same URL in Firefox and it completely messes up - at the bottom with the text going under the footer and such.

    I'm calling on WDF to help me try and fix it I've attached a .zip file which contains the test site, currently just the homepage, images and the external stylesheet I've used. I'd be so grateful if someone could take the time to have a look through and try to locate and solve the problem for me

    I would really like to get the site converted to CSS because it's just cleaner so any help is much appreciated and if you need to know anything else, just ask

    Thanks in advance,

    Will.
    Rednerve
    Creative Freelance Design

  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 see a problem right off-hand ...

    In the bottom of your HTML, the <div> in "red" is an extra <div>.
    Try removing it. Then, I think you'll have a couple problems with
    width values ... you'll have to adjust.

    Code:
    	<div id="right_main"><img src="contact_me.jpg" width="145" height="75" /><br />
        <img src="view_portfolio.jpg" width="145" height="75" />	</div>
    </div>
    
    <div id="footer_container">
      <div class="text" id="footer_left">Client Login | Design Contract </div>
    	<div class="text" id="footer_right">&copy; Copyright 2006 | <strong>Rednerve</strong> </div>
    </div>
    
    </div>
    </body>
    </html>

    EDIT:
    You also went through the trouble to end your <img src> tags with /> to help
    with validation. Make sure you put an alt="" in each <img src> tag ...
    This is required, even if it's null.
    Code:
    <img src="view_portfolio.jpg" width="145" height="75" alt="" />
    Code:
    <img src=  ....   alt="This is the tooltip for IE and accessibility" title="This is the tooltip for Firefox" />


  4. #3
    Senior Member
    Join Date
    Mar 2004
    Posts
    1,518
    Member #
    5220
    The bottom </div> is to close the "main_container" <div> which holds all the others so it is needed. I am going to make the changes to the image tags but would prefer to get this problem fixed first.

    Anyone got any more ideas?
    Rednerve
    Creative Freelance Design

  5. #4
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    OK ...

    See my test site ....

    I only made changes to "main2.css"

    Here's the site (realize I'm missing some graphics)...

    http://www.catpin.com/test


    Also, the paths to graphics in my "main2.css" are different.
    I put all the graphics in the index directory for my example.

    You can see where only "main_container" has the solid borders,
    the others are commented out. It looks good in both IE and Firefox.

    http://www.catpin.com/test/main2.css

    EDIT:
    My "background.gif" red gradient is sort of crappy.
    You should create a nice clean gradient using a good graphic editor.


  6. #5
    Senior Member
    Join Date
    Mar 2004
    Posts
    1,518
    Member #
    5220
    Thanks for doing that, it's great apart from now the borders on the side of the central column do not go all the way down to the bottom - see www.rednerve.com/test/index2.php now. Do you have any ideas as to why it's doing that, lol?

    I attached the new files in a .zip file if you can take a look.

    Thanks,

    Will.
    Rednerve
    Creative Freelance Design

  7. #6
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    Look at my test pages again .... I think I'm real close now.

    You'll have to look at the "main2.css" to see what I've changed.

    http://www.catpin.com/test

    http://www.catpin.com/test/main2.css


  8. #7
    Senior Member
    Join Date
    Mar 2004
    Posts
    1,518
    Member #
    5220
    Same problem in Firefox still
    Rednerve
    Creative Freelance Design

  9. #8
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    Does is look wrong on your site or my test site?

    My test site looks OK on Firefox and Safari.
    At least on my laptop, it looks OK.

    My test site is still missing some graphics and
    navigation ... maybe that's the difference.

    Did you clear your cache and click refresh?


  10. #9
    Senior Member
    Join Date
    Mar 2004
    Posts
    1,518
    Member #
    5220
    It looks wrong on both sites when using the code you supplied for main2.css. I cleared my cache, refreshed but still get the same problem - here's a screenshot of the problem circled:

    http://i1.tinypic.com/v6pzqr.jpg

    Does that help?
    Rednerve
    Creative Freelance Design

  11. #10
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    That is strange ...

    When I view it with Safari, it looks OK ...

    Go here and enter the URL:
    http://www.snugtech.com/safaritest/


    On my laptop it looks OK.

    I'm thinking that it looks OK when it fits the browser vertically,
    but as soon as the vertical slide bar appears, it messes up.
    This might be a clue.

    I'll look closer at it again when I get back to my
    Firefox browser tomorrow (Wed.)



Page 1 of 3 1 2 3 LastLast

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