Results 1 to 8 of 8

Thread: [RESOLVED] Fixed Width changing on different screens...is this possible?!

  1. #1
    Join Date
    Oct 2008

    resolved [RESOLVED] Fixed Width changing on different screens...is this possible?!

    So I'm building up a test site for a client on a folder on my website:


    Once it's done, it'll be switched over to a new live server. The site has a fixed width which I'm actually specifying with PHP (the stylesheet uses PHP, but caches it, don't worry). So when I'm specifying the width of the site, I'm using this $pagewidth variable, and it's 1000px. All is well in testing. I just download chrome on my iPad, and test the site. What the hell??

    The site is compacted. The tractor is pushed slightly inwards, but still sits at the left-most edge. The little things on the right on the home page that say about consultancy and contacting us etc. spill onto a new line. Same goes for Safari on the iPad. I then test it on another, older computer in the house, and have the same result.

    I've never come across a situation like this, where a fixed width website renders differently on different screens.

    What's happening?

    Cheers guys.

  2. #2
    Join Date
    May 2005
    Gold Coast (MS)
    It will always happen as the way a web page looks depends on the browser's viewport size at any screen resolution.

    Choosing Dimensions for Your Web Page Layout:

    In Search of the Holy Grail: http://www.alistapart.com/articles/holygrail/
    Choosing Dimensions for Your Web Page Layout: http://www.elated.com/articles/choos...b-page-layout/
    How to create flexible sites quickly using standards like CSS and XHTML: http://www.ibm.com/developerworks/web/library/wa-rapid/
    Care With Font Size: http://www.w3.org/QA/Tips/font-size
    Designing for the Web: Resolution and Size: http://sitepointcom.createsend4.com/...yd/birtthtw/h/

    Websites Shouldn’t Look The Same Across Different Browsers: http://www.noupe.com/design/websites...re-is-why.html
    Cross-Browser CSS in Seconds with Prefixr: http://net.tutsplus.com/articles/new...-with-prefixr/
    Responsive Web Design Demystified: http://www.elated.com/articles/respo...n-demystified/
    Responsive Web Design: 5 Handy Tips: http://www.elated.com/articles/respo...-5-handy-tips/
    It’s Not Responsive Web Building, It’s Responsive Web Design: http://www.getfinch.com/finch/entry/...ve-web-design/

    Beginner’s Guide to Responsive Web Design: http://thinkvitamin.com/design/begin...ve-web-design/

    Adapt.js - Adaptive CSS: http://adapt.960.gs/

  3. #3
    Join Date
    Oct 2008
    Yes, but this is a fixed width. There should be no variance in the space available to me from browser to browser. Fair enough, if the resolution of a screen is small, they will have to scroll sideways (the width is only 1000px though), but the actual area of the webpage should remain the same. It doesn't.

    EDIT: I mean it's a good 50px or so out. What gives?
    Last edited by flashcus; 07-05-2012 at 03:30 AM.

  4. #4
    Join Date
    May 2005
    Gold Coast (MS)
    Fixed width does not mean absolutely fixed as it is all relative to the browser's viewport size. If the vertical and horizontal content can not be viewed, then the default action of the browser is to generate scrollbars for the viewer unless you have CSS rules overriding this action (visibility: hidden. I have a 23-inch screen and using a high resolution, yet, if I resize my browser small enough, it will generate a horizontal scrollbar along with the vertical one which probably has already been generated.

  5. #5
    Join Date
    Oct 2008
    Exactly, the same goes for me. If I scale my browser to a small size, scrollbars are generated. This is normal and what I want. However, on my iPad and another computer, the actual size of the website is reduced. Maybe a screenshot will help..

  6. #6
    Join Date
    May 2005
    Gold Coast (MS)
    You're talking about the mobile web which is a different "animal" all together:

    Mobile Website:

    5 Stunning and Usable Mobile Website Designs: http://designfestival.com/5-stunning...&utm_term=More
    Learn the Mobile Web: http://learnthemobileweb.com/2009/07/mobile-meta-tags/
    10 Ways the Mobile Web is Different: http://www.elated.com/articles/10-wa...-is-different/
    Redesigning a Site For Mobile: What's Involved?: http://www.elated.com/articles/redes...hats-involved/
    How to Validate and Test for the Mobile Web:

    Make Your WordPress Website Mobile-Friendly in Minutes: http://designfestival.com/make-your-...dly+in+Minutes

    Web Mobile Browser Shots: https://browshot.com/

  7. #7
    Join Date
    Oct 2008
    Like I said, on another computer as well running the latest version of firefox. Not just the mobile web.

  8. #8
    Join Date
    Oct 2008
    Fixed. I knew it wasn't possible. The site was still rendering at 1000px, but it was all to do with fonts. Not to worry, all is good.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



X vBulletin 4.2.2 Debug Information

  • Page Generation 0.15315 seconds
  • Memory Usage 2,917KB
  • Queries Executed 13 (?)
More Information
Template Usage (32):
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_global_above_footer
  • (1)ad_global_below_navbar
  • (1)ad_global_header1
  • (1)ad_global_header2
  • (1)ad_navbar_below
  • (1)ad_showthread_firstpost_sig
  • (1)ad_showthread_firstpost_start
  • (1)ad_thread_first_post_content
  • (1)ad_thread_last_post_content
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)headinclude_bottom
  • (8)memberaction_dropdown
  • (1)navbar
  • (4)navbar_link
  • (1)navbar_moderation
  • (1)navbar_noticebit
  • (1)navbar_tabs
  • (2)option
  • (8)postbit
  • (8)postbit_onlinestatus
  • (8)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available (6):
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files (26):
  • ./showthread.php
  • ./global.php
  • ./includes/class_bootstrap.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/functions_navigation.php
  • ./includes/class_friendly_url.php
  • ./includes/class_hook.php
  • ./includes/class_bootstrap_framework.php
  • ./vb/vb.php
  • ./vb/phrase.php
  • ./includes/functions_facebook.php
  • ./includes/functions_calendar.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_notice.php
  • ./packages/vbattach/attach.php
  • ./vb/types.php
  • ./vb/cache.php
  • ./vb/cache/db.php
  • ./vb/cache/observer/db.php
  • ./vb/cache/observer.php 

Hooks Called (70):
  • init_startup
  • friendlyurl_resolve_class
  • init_startup_session_setup_start
  • database_pre_fetch_array
  • database_post_fetch_array
  • init_startup_session_setup_complete
  • global_bootstrap_init_start
  • global_bootstrap_init_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • load_show_variables
  • load_forum_show_variables
  • global_state_check
  • global_bootstrap_complete
  • global_start
  • style_fetch
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • strip_bbcode
  • friendlyurl_clean_fragment
  • friendlyurl_geturl
  • forumjump
  • cache_templates
  • cache_templates_process
  • template_register_var
  • template_render_output
  • fetch_template_start
  • fetch_template_complete
  • parse_templates
  • fetch_musername
  • notices_check_start
  • notices_noticebit
  • process_templates_complete
  • friendlyurl_redirect_canonical
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • memberaction_dropdown
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • build_navigation_data
  • build_navigation_array
  • check_navigation_permission
  • process_navigation_links_start
  • process_navigation_links_complete
  • set_navigation_menu_element
  • build_navigation_menudata
  • build_navigation_listdata
  • build_navigation_list
  • set_navigation_tab_main
  • set_navigation_tab_fallback
  • navigation_tab_complete
  • fb_like_button
  • showthread_complete
  • page_templates