Approaches to CSS Layout .
Explain fixed Layout and Liquid Layout with example each. List liquid and Fixed layout Advantages and limitations.

APPROACHES TO CSS LAYOUT
One of the main problems faced by web designers is that the size of the screen used to view the page can vary quite a bit. Most designers take one of two basic approaches to dealing with the problems of screen size. While there are other approaches than these two, the others are really just enhancements to these two basic models.
1 FIXED LAYOUT
• The first approach is to use a fixed layout. In a fixed layout, the basic width of the design is set by the designer, typically corresponding to an “ideal” width based on a “typical” monitor resolution.
• A common width used is something in the 960 to 1000 pixel range, which fits nicely in the common desktop monitor resolution (1024 × 768). This content can then be positioned on the left or the center of the monitor.
• Fixed layouts are created using pixel units, typically with the entire content within a <div> container (often named "container", "main", or "wrapper") whose width property has been set to some width, as shown in Figure.
• The advantage of a fixed layout is that it is easier to produce and generally has a predictable visual result. It is also optimized for typical desktop monitors; however, as more and more user visits are happening via smaller mobile devices, this advantage might now seem to some as a disadvantage.
• Fixed layouts have other drawbacks. For larger screens, there may be an excessive amount of blank space to the left and/or right of the content. Much worse is when the browser window shrinks below the fixed width; the user will have to horizontally scroll to see all the content, as shown in Figure

2 LIQUID LAYOUT
• The second approach to dealing with the problem of multiple screen sizes is to use a liquid layout (also called a fluid layout). In this approach, widths are not specified using pixels, but percentage values.Percentage values in CSS are a percentage of the current browser width, so a layout in which all widths are expressed as percentages should adapt to any browser size, as shown in Figure 5.29.
• The obvious advantage of a liquid layout is that it adapts to different browser sizes, so there is neither wasted white space nor any need for horizontal scrolling.
Advantages and Limitations of Fluid/Liquid Layout
Advantages in certain situations
can be constrained with max width, min width property, does not include padding borders or margin, Max height and min height does not include padding, borders, or margin By using a mixture of width, height, overflow, and max, min we can take control of both fixed width, fluid and fixed/fluid layouts Pros/Benifits
-Fluid can be more user friendly because it adjusts to the users set up. -If designed well can eliminate horizontal scroll bars that appear on small screen sizes. -Also with wider screens more or all of the content will appear on the screen above the fold and so there may be no need for vertical scrolling at all.
Cons/Limitations
-The designer has less control over what the user sees -Elements that usually have a fixed width such as images, video may have to be set at multiple widths to accommodate different screen sizes. -Lack of content on large screen sizes may create a lot of white space and long unreadable paragraph lines.

---

Advantages and disadvantages of fixed Layout
----- These are the advantages of fixed-width design: -----
-The basic layout of the page remains the same regardless of canvas size. This may be a priority for companies interested in presenting a consistent corporate image for every visitor. -Fixed-width pages and columns provide better control over line lengths, preventing them from becoming too long when the page is viewed on a large monitor.
---- disadvantages ----
-If the available browser window is smaller than the grid for the page, parts of the page will not be visible and may require horizontal scrolling to be viewed. Horizontal scrolling is a hindrance to ease of use, so it should be avoided. (One solution is to choose a page size that serves the most people, as discussed later in this section.) -Elements may shift unpredictably if the font size in the browser is larger or smaller than the font size used in the design process. -Trying to exert absolute control over the display of a web page is bucking the medium. The Web is not like print; it has its own peculiarities and strengths.