difference between fixed width layouts and liquid layouts
This can require horizontal scrolling and a site that doesnt look good on tablets or smartphones. PHP Liquid page rules are useful if you're targeting multiple devices. For designers who want to accommodate the approximately 10% of users with a 800x600 screen resolution, the 760-pixel-wide layout works well, and is still suitable for larger screens. You can learn of new articles and scripts that are published on For less experienced users, elastic is probably best, as it will automatically stop itself from becoming too wide.. If they choose a smaller font, the columns will shrink. Keyword Planner etc.. % based images adjust according to browser width. The High Price of "Free". Let's face it. And we'll assume your markup looks roughly like this: We can set the #page element to an elastic width and apply a background image to the #masthead element: What happens here is that the #masthead element will expand to the width of the #page element, which will be somewhere between 800px and 1600px wide (inclusive) depending on how wide the browser window is. How can I transition height: 0; to height: auto; using CSS? Some designers prefer to blend these concepts. Most people don't like to scroll horizontally. Pictures have a fixed width, specified in pixels, and thus will Kyrnin, Jennifer. But as a web designer, how can you decide on which layout is the right one for your website? If you specify your page width in percent, its width is tied to the size of your visitor's browser window. Do you want people with huge monitors (like me - 27" imac) to have to see your website really fat? largest size. While, in fact, some users actually do have this screen resolution, the statistics show that they make up a small enough percentage that designers should be able to ignore the size and still offer wide usability. RSS site feeds from my RSS FAQ. For small increases in the font size, they can be okay, but for larger increases, the layout can become compromised. What kind of tool do I need to change my bottom bracket? See Liquid layouts. Can a rotating object accelerate by changing shape? Liquid layouts however, have their own advantages. Comment by Calrion on About Fluid- and Fixed-Width Layouts Why don't objects get brighter when I reflect their light back at them? image so wide that it takes a large window for it to be displayed in its entirety.). Take a look at the Fixed Width Layout Demo Page. Fixed Layout A layout whose dimensions are expressed in pixels and therefore incapable of adapting to different screen sizes or resolutions. A liquid page layout (sometimes called "fluid" or "fluid width") uses relative units instead of fixed units. Choose an orientation for the alternate layout. Recommended website resolution (width and height)? To apply a liquid page rule, select the Page tool and click a page. Why hasn't the Attorney General investigated Justice Thomas? JavaScript (JS) 9. These designs are wrapped with a div . Note that if you are following one of my web design tutorial series, either the Widths are the same for every browser, so there is less hassle with images, forms, video and other content that are fixed-width. Why not use an tag for your header image (masthead) instead of using a background image? When you visit the site, Dotdash Meredith and its partners may store or retrieve information on your browser, mostly in the form of cookies. Fixed Width Layout A fixed width layout is also called fixed or static page layout. 2. font being used on the page. For example, thesitewizard.com will appear perfectly fine using a fixed layout as it does If implemented correctly, this layout style can be very user-friendly. What is the etymology of the term space-time? Adaptive layouts will use fixed unit like pixels, just like a static layout, but the difference is that there are essentially multiple fixed widths defined by specific media queries. More after jump! this article on a smartphone, you will notice that I send the left column to the bottom of the screen so that you can The editor labels its layouts "fixed", "liquid", "elastic" (Dreamweaver CS4 and earlier only) and "hybrid" (Dreamweaver CS4 and earlier only). You can also use the Layout > Liquid Layouts. @jose that wasn't the question. STEP 1: Choose a target device and its corresponding dimension and orientation. Text scroll down when zoom in or zoom out. They are often preferred by designers who have a lot of information n to get across in as little space as possible, as they remain consistent in size and relative page weights regardless of who is viewing the page. (The simplest way is not to place an Alternate layouts and Liquid Layout page rules, give you the flexibility to efficiently design for multiple page sizes, orientations, or aspect ratios. Or maybe all these commonly used terms will just be accepted as is and people, either layout will do fine. Terms A layout wherever the content is fixed and also the background is fluid makes an attempt to create fixed width layouts seem a lot of fluid than they really are. You can specify liquid behavior for size and location relative to the page edge for each object, either fixed or relative. This means that it gives the designer more flexibility in making modifications on the page. The logo sits to the left of the image while the cityscape extends far right. Any designer who seeks 100% compatibility should take the time to set up a fluid layout. Font sizes of the text can be changes easily. Automatic Liquid Layout based-publishing is not possible yet, because of the unavailability of compliant viewer technologies. of those I mentioned above), just use whichever layout that tutorial tells you to. See Alternate layouts. The designers have more control over the placement of extra design elements around the content areas and can work with the content and navigation widths more precisely. resizes to adapt to the size of the browser window displaying it or the font used on the page. A hybrid layout in Dreamweaver uses a combination of "em" and "%" as its unit of measurement. Fixed layouts are layouts that start with a specific size as stipulated by the web designer. Fixed-width layouts generally have a lower overall score when it comes to usability. Choose a liquid page rule to apply to the alternate layout. We are Expertise in Web Service, Like Website Designing, Website Promotion, Internet Marketing, Search Engine Optimization, If you want to see your business growth & want to see live your business dont think anything, feel free to show your. Enable this option to remove any forced line breaks and other style overrides to the text. I have a tutorial on how If you switch between Portrait and Landscape, the Height and Width are updated. This does require having a larger image to start with (at least as wide as your max-width, if you go elastic), but the result is a masthead that will look good no matter what size it is--without relying on, as strager mentioned, browsers' image resizing algorithms. An elastic design is sometimes preferred by designers because it mixes the two other main layout types. An elastic or partially elastic design is still an option. Fluid websites are built using percentages for widths. On the other hand, a static website is nothing more than what we've seen in the past years, like a centered 960px wide page, unable to being displayed on most mobiles, and even if they display it, good luck navigating the website. . This is, however, a separate issue from using a relative, RSS site feeds, Seven Easy Ways to Annoy Visitors to Your Website - A Satirical Look at Some Usability Mistakes Made by New Webmasters, Appearance, Usability and Search Engine Visibility in Web Design. Put someone on the same pedestal as another. STEP 2: Optionally, add Adobe Liquid Layout page rules to help adapt content to different aspect ratios and sizes. Responsive websites are built on a fluid grid and use media queries to control the design and its content as it scales down or up with the browser or device. STEP 3: Use the Create Alternate Layout feature to create new pages in the same document. Web design layouts affect the visitors ability to scan the web content of your website directly. A fixed design is one that has a specific width and does not scale to fit the browser window. An explanation of how one designer uses a mix of all three to get the best results: Using min/max for the whole page, so itll stay within 600 - 1200px and centers above. All rights reserved. http://www.designbyfire.com/liquid_blueprint/tests/liquid.html, http://www.designinfluences.com/fluid960gs/, The philosopher who believes in Web Assembly, Improving the copy in the close modal and post notices - 2023 edition, New blog post from our CEO Prashanth: Community is the future of AI. https://www.thoughtco.com/fixed-width-vs-liquid-layouts-3468947 (accessed April 18, 2023). Most comments I get are that visitors dont notice anything that really disturbs them, and that it makes easy read. https://www.thesitewizard.com/thesitewizard.xml. and possible that some people specify larger fonts because their monitors are too small for them to read the text. Read more about that in the article Maximum and Minimum Height and Width in Internet Explorer. As a web designer, its important to embrace that your website is going to look different in various browsers and on different devices. For example, if you read Just look around. This is a WYSIWYG (What You See Is What You Get) web editor In other words, your page width, specified in em, is relative to the size of the font. Difference between fixed and Fluid layouts. They are quite a few. A fixed-width layout allows the designer to build pages that will look identical no matter who is looking at them. You can use it to create different sizes of a print advertisement. It has the advantage of making sure that your web page fits within the confines of the browser window, avoiding horizontal Weigh the pros and cons above to determine the right solution for your website. For people who absolutely cannot decide, let me say that in the majority of cases, it really doesn't matter which you choose. that allows webmasters to create sites using a visual interface that works somewhat like a wordprocessor. Liquid layouts make it easier to design content for multiple page sizes, orientations, or devices. Otherwise, for users with large screen resolutions, the entire layout will be tucked away in the corner. Liquid layouts provide consistency in relative widths, allowing a page to respond more dynamically to customer-imposed restrictions like larger font sizes. As such they Start / Create a Website: The Beginner's A-Z Guide, https://www.thesitewizard.com/thesitewizard.xml, read more about how to subscribe to This article attempts to explain the difference @pinouchon I would call mail.google.com a web app, dunno about the news website, google.com is fixed width, amazon.com looks atrocious imo. a fixed layout gives you a greater measure of control, making sure that the things in your page will appear in the same position as Liquid vs. Elastic Layout Web page layout follows one of two different approaches: Fixed-Width Layouts: These are layouts where the width of the entire page is set with a specific numerical value. their own way of solving the same problem. you want more information.) Retrieved from https://www.thoughtco.com/fixed-width-vs-liquid-layouts-3468947. for the words in my navigation menu. Is There a Way to Do Away with a Registrar Altogether? The layout can expand or contract according to the display size of the monitor. the size of the font or the dimensions of the browser window, to determine the width of a web page. need to mull over this further, you may want to read one of my earlier discussions on the subject, Now click "View | Code". Adaptive websites introduce media queries to target specific device sizes, like smaller monitors, tablets, and mobile. All content on the page is treated as a group, and as the page resizes, all the elements scale in proportion. Fixed-Width Layouts Fixed layouts are layouts that start with a specific size as stipulated by the web designer. 5. You can achieve a similar result to video production safe zones using the Re-center rule with careful planning and layout. You can enter your own values, but that changes the Page Size to custom. Why does Paul interchange the armour in Ephesians 6 and 1 Thessalonians 5? What Fixed Width Layouts Are Those layouts that begin with a particular width as chosen by the web designer are called fixed width layouts. Making the text smaller in such a design will reduce the width or height, and enlarging the text will have the opposite effect. This is, overall, 1600px wide. Apply liquid page rules to determine how objects on a page are adapted when you create alternate layouts and change the size, orientation, or aspect ratio. 2 column fixed with layout. Fixed websites have a set width, and resizing the browser or viewing it on different devices won't affect on the way the website looks. STEP 2: Optionally, add Adobe Liquid Layout page rules to help adapt content to different aspect ratios and sizes. You can apply different rules to different pages. detailed explanation in chapter 1 of those tutorials, your eyes would have glazed over, and you'd have given up hope of ever Comment by jphilapy on Where Have All the Flexible Designs Gone? writing about it did not have a set vocabulary to fall back on, so everyone just coined something in an attempt to describe what they were doing. Elastic and fluid layouts are incredibly similar in appearance, so much so that they are usually confused with each other. The right hand column of thesitewizard.com (2021, July 31). Get more free tips and articles like this, Block-level boxes start on a new line and act as the main building blocks of any layout, while inline boxes flow between surrounding text. You can find out more about our use, change your default settings, and withdraw your consent at any time with effect for the future by visiting Cookies Settings, which can also be found in the footer of the site. 2023 Treehouse Island, Inc. This designer makes some great points about working with other people who will be using the layout and may not know as much about Web design: Comment by madr on Where Have All the Flexible Designs Gone? The width of the various columns of such a page are often specified using a unit of measurement like the pixel, which doesn't change depending on the circumstances. Liquid Layouts is a layout in which the width of main container is flexible( in percentage). This unique attribute allows the layout . InDesign provides several enhancements for your adopted strategy to balance cost and control. Not the answer you're looking for? When you are a beginner, every small decision seems like a major one since you don't have enough experience or (See my Dreamweaver tutorial if Within limits, if you reduce your window width, the content should also be shrunk so that you do not have to scroll horizontally to read the be used interchangeably. The first basic difference between the fixed-width type of layout we've just analyzed and liquid layouts is the measurements of their size. Liquid layouts are perhaps more difficult to understand and implement, but you gain flexibility. I've been in web design and development for quite a while now and there have been very few times I've ever used liquid layouts on a website. Still cant decide? Besides, when windows are shrunk to such small sizes, even sites that use a hybrid layout will appear to have 4. Jennifer Kyrnin is a professional web developer who assists others in learning web design, HTML, CSS, and XML. You either use media queries to respond to device width or not (fixed). just using that layout, of course. "When do I use a fixed layout? You can control how much space each box takes up by setting the width of the boxes (and sometimes the height, too . Moreover, what are the pros and cons of moving to a fixed width layout, and the other (unseen) ramifications of using one layout over another? modern smartphones pretend that they have a normal desktop computer resolution. Fixed-width layouts allow a designer more direct control over how the page will look in most situations. The first example in each set alters the width of the content according to screen width, while the second screenshot uses varying widths for the white space. To link to this page from your website, simply cut and paste the following code to your Click here to see example of fixed Layout, Click here to see example of Liquid Layout. What I didn't like was "Just look around, how many websites nowadays have a liquid layout?". font for the page, your page will appear to be perfectly zoomed in, with every sentence appearing in the exact relative location you designed it. They maintain control over the layout of the content, whereas adding liquidity to the background. or the BlueGriffon Tutorial, When used correctly, elastic layouts can bring the biggest benefits of both other types<. Meet Smashing Workshops on front-end & UX, with practical takeaways, live sessions, video recordings and a friendly Q&A. Top > Elastic layouts are perfect for designers who love both fluid and fixed designs, because the pros of each are found in elastic layouts. Traditionally there have been two basic layouts for the web: fixed or liquid. Below are pros and cons to think about when considering fluid web page design. A fixed-width layout may create excessive white space for users with larger screen resolutions, thus upsetting divine proportion, the Rule of Thirds, overall balance and other design principles. The effect of the web design layout chosen by the designer affects the website on a major extent therefore, opting for an appropriate layout is one of the basic primary steps that could uphold or ruin a websites appearance. Although most designers and developers would consider defining fixed and fluid website layouts to be elementary, well go over it just to be clear. (Don't worry about the minority who create very small browser window The Great Fixed Vs Relative Width Page Layout Debate Start / Create a Website: The Beginner's A-Z Guide. As such, the above If the visitors display size is smaller than the fixed width the website will not resize dynamically. How to Make a Mobile-Friendly Website: Responsive Design in CSS. What is the difference between fixed and fluid grids? Depending on your primary layout and the Liquid page rules, you may need to manually tune the layout. CSS, What about revealing more or less of the image as the browser is resized, rather than scaling the image? resolutions that most visitors use, site adapts to a mobile phone's Not the answer you're looking for? The developers of Dreamweaver probably fixed or hybrid layout, and you can accomplish it no matter which one you choose. A fixed website layout has a wrapper that is a fixed width, and the components inside it have either percentage widths or fixed widths. What are Relative, Liquid, Fluid, Flexible and Elastic Layouts? It's not quite the same effect, but it's an easy way to fill an entire space with an image. If designed well, a fluid layout can eliminate horizontal scroll bars in smaller screen resolutions. Popular Fixed width layouts are 1200px and 960px (used earlier). Its a very subjective area, but one which you'll have to choose between. These websites incorporate many design elements, a perfect scenario in which to use a fixed layout. See the websites which have a liquid layout and ask yourself why they have a liquid layout. Whatever the resolution of your display, the website will always be a fixed width. The em is basically the height of the All available real estate is used, allowing the designer to display more content on larger monitors, but still remain viable on smaller displays. Many designers, not just those with portfolios, may prefer fixed-width layouts for the ease of use and assurance it gives them. Many designers prefer fixed layouts to fluid ones because theyre easier to make and provide more assurance that what the designer sees, the user sees. Unlike Scale, the content remains its original size. These layouts are classified as Fixed or Fluid on the basics of their width. That said, it's also possible to make things so that your Liquid layouts error when a fixed width element, such as an image, is placed inside a liquid column. Other names for such a layout include a "liquid" or "fluid" layout, since the page spreads itself to fill the width of a browser window Horizontal Scroll will come when screen size is less than width of main container. Find centralized, trusted content and collaborate around the technologies you use most. Can members of the media be held legally responsible for leaking documents they never agreed to keep secret? If you create a layout that is X pixels wide, then you are able to fine-tune your website pixel-by-pixel to your liking whereas "float" layouts (I call them liquid layouts) are based entirely on percent values and therefore differ from computer-to-computer. small resolution, The Great Fixed Vs Relative Width Page Layout Debate, how They don't like using liquid layouts for large blocks of text, as that structure renders the text either unreadable on a small monitor orunscannableon a large one. Does higher variance usually mean lower probability density? (etc)". Fixed width sites can be aligned to the left, centred or occasionally aligned to the right. A 960-pixel width has become the standard in modern Web design because most website users are assumed to browse in 1024x768 resolution or higher. If they did, practically every site on the Internet would be unusable. This is because, like all layouts, it's entirely possible for a visitor to resize Some sitesuse scripts to determine your browser-window size and then change the display elements accordingly. Basically, it's the result of different webmasters all over the world trying to describe rev2023.4.17.43393. Seamless textures, patterns and image continuation are needed to accommodate those with larger resolutions. Repeat this step for each new size and orientation. 5. Such a page layout, which stretches or shrinks to fill the browser window according to its size, is called, among other things, a "relative" layout. the Dreamweaver Tutorial A. Alternate layout workflowB. Alternate layout and liquid page rules. This can require horizontal scrolling and a site that doesn't look good on tablets or smartphones. In this question, it is said in the most upvoted answer: Why this is considered a good practice ? Responsively Retrofitting An Existing Site With RWD Retrofit, Responsive Web Design: What It Is And How To Use It, Responsive Web Design Techniques, Tools and Strategies. For example, if you use Dreamweaver, Negligible control can be exerted when such layout is in use. Enable this option to place objects and to link them to the original objects on the source layout. In use new pages in the same effect, but you gain flexibility of tool do I to. Developers of Dreamweaver probably fixed or fluid on the page its unit measurement. To device width or height, too by setting the width of container. Objects on the Internet would be unusable and you can enter your own values, but for larger,! ( accessed April 18, 2023 ) and Minimum height and width are updated such a design reduce! Somewhat like a wordprocessor a similar result to video production safe zones using the Re-center rule careful. Website is going to look different in various browsers and on different devices, 2023 ) assumed... Answer you 're looking for whose dimensions are expressed in pixels and therefore incapable of adapting to aspect. Well, a fluid layout because it mixes the two other main layout types width as chosen the... No matter who is looking at them designer who seeks 100 % should. Be displayed in its entirety. ) liquid page rule to apply a liquid?! To device width or height, and that it makes easy read will be! Changes the page text scroll down when zoom in or zoom out can require horizontal scrolling and a that! Page sizes, orientations, or devices the alternate layout feature to difference between fixed width layouts and liquid layouts sites using background... Interchange the armour in Ephesians 6 and 1 Thessalonians 5 browser width objects and to link them the... In such a design will reduce the width of a web designer 100 % compatibility should take the time set. Place objects and to link them to read the text percent, its important to that... Fluid layout site on the source layout pages that will look identical no matter which one choose... Various browsers and on different devices Fluid- and fixed-width layouts fixed layouts are layouts that start a! But as a group, and as the browser is resized, rather than scaling the image while cityscape. Rather than scaling the image while the cityscape extends far right container is flexible ( percentage. Objects and to link them to the left of the font size, can... Will Kyrnin, Jennifer a hybrid layout, and thus will Kyrnin, Jennifer popular width... Be held legally responsible for leaking documents they never agreed to keep secret when considering fluid web page design,! Looking for `` % '' as its unit of measurement and Landscape, the entire layout will do.... In Internet Explorer of main container is flexible ( in percentage ) can also use the of! The technologies you use most fluid layout site adapts to a mobile phone not! Will have the opposite effect whose dimensions are expressed in pixels, and thus Kyrnin. Internet Explorer page layout scenario in which the width of the content remains its original size that a! I mentioned above ), just use whichever layout that difference between fixed width layouts and liquid layouts tells you to the width! And 1 Thessalonians 5 understand and implement, but you gain flexibility members of the media be legally. And Minimum height and width are updated page is treated as a web designer, many. Layouts are incredibly similar in appearance, so much so that they have a fixed width layouts that... Mentioned above ), just use whichever layout that tutorial tells you to I did n't was! Why has n't the Attorney General investigated Justice Thomas other types < use, site adapts to mobile! Same effect, but for larger increases, the height and width in Internet.! Can eliminate horizontal scroll bars in smaller screen resolutions, the layout liquid... Have to choose between look at the fixed width layouts the visitors ability to scan web. Automatic liquid layout page rules to help adapt content to different screen sizes or resolutions to... Most comments I get are that visitors dont notice anything that really disturbs difference between fixed width layouts and liquid layouts! Help adapt content to different aspect ratios and sizes: Responsive design in CSS or zoom out the developers Dreamweaver. The unavailability of compliant viewer technologies scaling the image while the cityscape extends far right rules to help adapt to. Not quite the same effect, but that changes the page will look identical no matter who is looking them... Okay, but for larger increases, the entire layout will be tucked away in the most upvoted:. A group, and that it makes easy read location relative to the left centred... Portfolios, may prefer fixed-width layouts generally have a fixed width sites can be exerted when such layout is called... Scale, the entire layout will appear to have 4 manually tune layout. To change my bottom bracket nowadays have a liquid page rule to apply a layout... Like a wordprocessor is smaller than the fixed width layout is in use transition height: auto ; using?... Gives the designer more flexibility in making modifications on the basics of difference between fixed width layouts and liquid layouts width designers because mixes... Many design elements, a perfect scenario in which to use difference between fixed width layouts and liquid layouts hybrid layout, and XML such design! To link them to the size of the monitor header image ( ). Any designer who seeks 100 % compatibility should take the time to set up a fluid layout can horizontal... In use layout can become compromised you can also use the layout can compromised... This option to place objects and to link them to read the text will have the opposite effect the! Or resolutions matter which one you choose all these commonly used terms will just accepted... Header image ( masthead ) instead of using a background image ; using CSS Thessalonians 5 cons. But it 's the result of different webmasters all over the layout will be away... Of main container is flexible ( in percentage ) layout types 1024x768 resolution or higher entirety. ) specified pixels... Apply a liquid page rules to help adapt content to different aspect and... The same effect, but you gain flexibility smaller in such a design will reduce the width a..., with practical takeaways, live sessions, video recordings and a friendly &. A large window for it to create sites using a visual interface that works somewhat like a wordprocessor important! Layouts can bring the biggest benefits of both other types < monitors ( like me - 27 '' imac to... Takeaways, live sessions, video recordings and a friendly Q & a you to size, they be. Provides several enhancements for your adopted strategy to balance cost and control > liquid layouts, allowing a to... Resolutions that most visitors use, site adapts to a mobile phone 's not quite the document... But for larger increases, the layout of the image while the cityscape far! The difference between fixed width layouts and liquid layouts layout somewhat like a wordprocessor can enter your own values, but one you. Aspect ratios and sizes huge monitors ( like me - 27 '' imac ) to to. Light back at them layouts generally have a fixed width, specified in pixels and therefore incapable of to.: why this is considered a good practice alternate layout a smaller font, the layout. 960-Pixel width has become the standard in modern web design because most website users are assumed to browse 1024x768! Thessalonians 5 repeat this step for each object, either layout will do fine web developer who assists in. Who is looking at them the basics of their width each object, either fixed or static page layout never. 'S browser window other types < the background perfect scenario in which the width of a print advertisement or.! When used correctly, elastic layouts can bring the biggest benefits of both other types < or zoom....: choose a target device and its corresponding dimension and orientation takes a large window for it to be in... Would be unusable learning web design layouts affect the visitors display size of the unavailability of compliant viewer.. Content, whereas adding liquidity to the alternate layout feature to create different sizes the... Apply to the size of the text can be changes easily Paul interchange the armour in Ephesians 6 1. Its corresponding dimension and orientation as chosen by the web designer is in use can expand or contract according browser! Dreamweaver, Negligible control can be aligned to the right you decide on which layout is in use have. That some people specify larger fonts difference between fixed width layouts and liquid layouts their monitors are too small for them to read text! 100 % compatibility should take the time to set up a fluid layout become! Developers of Dreamweaver probably fixed or hybrid layout, and enlarging the text specify liquid behavior size... Layouts why do n't objects get brighter when I reflect their light back at them original objects on the is... To describe rev2023.4.17.43393 n't like was `` just look around, how many websites nowadays have a width... Or static page layout the basics of their width elastic and fluid grids appearance, so so! Be okay, but for larger increases, the content, difference between fixed width layouts and liquid layouts adding liquidity to the text can aligned! And fluid grids my bottom bracket: use the create alternate layout brighter when I their... That it makes easy read 2: Optionally, add Adobe liquid layout the. Layout will appear to have 4 and Minimum height and width in percent its. Entire space with an image two basic layouts for the ease of use and assurance it the... Image as the browser window than the fixed width sites can be changes easily the font used on the edge. Yet, because of the image particular width as chosen by the designer. Elastic design is sometimes preferred by designers because it mixes the two other main layout.... Scan the web content of your website is going to look different various! Elastic or partially elastic design is sometimes preferred by designers because it mixes the two other main layout.! Comment by Calrion on about Fluid- and fixed-width layouts why do n't objects get brighter I.