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 10 of 10

Thread: Frusturated

  1. #1
    Junior Member
    Join Date
    Jul 2008
    Posts
    27
    Member #
    17066
    Ok, I am working on a new layout for my company located at http://dev.bkriegtech.net/web/07
    Displays fine on my 1680x1050 display, but on my 1280x800 laptop display, it is all messed up. Only on the initial page though, after that, everything is fine, aside from the "links" table on the bottom left.
    What am I doing wrong?
    (all pages are included with php include)

  2.  

  3. #2
    WDF Staff smoseley's Avatar
    Join Date
    Mar 2003
    Location
    Boston, MA
    Posts
    9,729
    Member #
    819
    Liked
    205 times
    Don't be frustrated!

    All you have to do is change your "content" div to a fixed size instead of a %.

    Modify this file: http://dev.bkriegtech.net/web/07/css/bluesky.css

    Find the #content item and change it to the following:
    Code:
    #content {
        float: right; 
        display: inline; 
        position: relative; 
        width: 728px; 
        font-size: 0.75em;
        background-color: #fff;
        border-right: 0.2em solid #4284B5;
        border-bottom: 0.2em solid #4284B5;
    }
    That should fix everything.

  4. #3
    Junior Member
    Join Date
    Jul 2008
    Posts
    27
    Member #
    17066
    Well that kind of worked.. but the nav bars on the left are below my content now

  5. #4
    Member
    Join Date
    Jul 2008
    Posts
    32
    Member #
    17036
    imho

    scrap the tables and scrap the images that you have for you 4 services and use divs instead - the images are too wide.

    stop developing sites on 1680x1050 and start using the laptop to preview earlier than you have. (even 1280 is too wide for a web page imho)

  6. #5
    WDF Staff smoseley's Avatar
    Join Date
    Mar 2003
    Location
    Boston, MA
    Posts
    9,729
    Member #
    819
    Liked
    205 times
    +1 - your entire website is too wide for your laptop. Design it to be a fixed width less than 1000 pixels, so that it will fit on most computer screens.

  7. #6
    Junior Member
    Join Date
    Jul 2008
    Posts
    4
    Member #
    17070
    The site layout is too wide because of the images in your #content area, which shouldn't be images at all because they contain text, which I'm assuming you will want Google to read?

    So, if you want to use a layout that expands and contracts with the browser window you need to design it so it works at 1000px wide first (maybe even 800px) Then allow it to expand. Also drop using tables for layout as it is bad practise / against W3C recommendation and negates the point of using CSS in the first place. These items, if you want them to be in that set of 4, should be in left / right divs each floated left and right, and their contents should be made to expand / contract.

    Also you have relatively positioned your floating divs which isn't really doing anything. Within your Wrapper element you need to also include a clearing item otherwise you may have problems down the line if you end up with pages where one column is longer than the other and you want to put something below them.

    BTW, you are using the DOCTYPE "strict" and you are line breaking with <br> which should be <br /> your <img> tags should be closed <img src ="" alt="" /> .

  8. #7
    Junior Member
    Join Date
    Jul 2008
    Posts
    27
    Member #
    17066
    Quote Originally Posted by skolzie
    The site layout is too wide because of the images in your #content area, which shouldn't be images at all because they contain text, which I'm assuming you will want Google to read?

    So, if you want to use a layout that expands and contracts with the browser window you need to design it so it works at 1000px wide first (maybe even 800px) Then allow it to expand. Also drop using tables for layout as it is bad practise / against W3C recommendation and negates the point of using CSS in the first place. These items, if you want them to be in that set of 4, should be in left / right divs each floated left and right, and their contents should be made to expand / contract.

    Also you have relatively positioned your floating divs which isn't really doing anything. Within your Wrapper element you need to also include a clearing item otherwise you may have problems down the line if you end up with pages where one column is longer than the other and you want to put something below them.

    BTW, you are using the DOCTYPE "strict" and you are line breaking with <br> which should be <br /> your <img> tags should be closed <img src ="" alt="" /> .

    The thing about expanding and contracting based on content, it already does that for every other page, just not the first one.
    (BTW I am using php includes for this site if no one has picked up on it.)

  9. #8
    Junior Member
    Join Date
    Jul 2008
    Posts
    27
    Member #
    17066
    Anybody have anything else for this?

  10. #9
    Junior Member
    Join Date
    Jul 2008
    Posts
    27
    Member #
    17066
    No need to post anymore, I fixed it and the site is live... http://www.bkriegtech.net

  11. #10
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    Now I'm not trying to be a wise-guy here ...

    I think you should know that this page (and maybe others)
    look differently on FF than IE6.0:

    http://www.bkriegtech.net/?page=design

    Also, the banner at the top of your website is wider
    than the columns ... and looks funny.

    If you're trying to sell web design, you should make
    every tiny detail, absolutely perfect. Check your site
    using several browsers, and several monitor sizes.



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