Make website to adapt to all screen resolutions

OK, first of all, I've been searching the forums and found a few questions about it, but honestly, I could not understand the response of those. So here it goes... once again...

I created my website for a resolution of 1680 x 1050, but then I realized not evybody in my company could see the site properly. I did a quick search, discovered the minimum screen resolution of my peers (1024 x 768) and tried to resize the entire site to adapt to those. At the end of the day, I could adjust the width and height was impossible to adapt to 768, unless I started to cut content, I don't want to.

I know there is a way to get all the screens, but I don't know where in the code I need to fix things.

I have a DIV wrapper with a DIV, a left DIV, DIV right header and footer DIV inside. Do I have to set all? And if so, I address to? %?

As you can see, I'm confused here. Here's my CSS. Cannot bind the site because it's on my intranet only.

@charset "utf-8";
{body
margin-top: 10px;
background-color: #000;
margin-right: auto;
left margin: auto;
}


{#wrapper}
height: 850px;
Width: 950px;
margin-right: auto;
left margin: auto;
background-repeat: no-repeat;
background-position: Center;
background-image: url (.. / Images/bgdr660.jpg);
}
#header {}
background-repeat: no-repeat;
Clear: none;
float: none;
height: 203px;
Width: 950px;
background-image: none;
position: relative;
}
{#sprymenu}
height: 26px;
Width: 950px;
Color: #000;
text-align: left;
do-family: Calibri;
font-size: 70%;
vertical-align: middle;
}

{#leftDiv}
Clear: none;
float: left;
height: 360px;
Width: 190px;
position: relative;
text-decoration: none;
}

{#rightDiv}
Clear: none;
float: right;
height: 420px;
Width: 755px;
position: relative;
}

#footer {}
height: 60px banner;
Width: 950px;
Clear: both;
position: relative;
padding-bottom: 20px;
}
. {FooterImg}
margin: auto;
}

a: link {}
text-decoration: none;
Color: #000;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
a: visited {}
Color: #000;
text-decoration: none;
}
a: hover {}
color: #454545;
}
a: active {}
color: #666;
}
. {Cabecalho}
do-family: Calibri;
font size: 24 PX.
make-weight: bold;
text-align: center;
color: #FFF;
}
{.pointer}
cursor: pointer;
text-align: justify;
padding-right: 20px;
do-family: Calibri;
}
{.answers}
make-weight: bold;
text-align: justify;
padding-right: 20px;
do-family: Calibri;
}

.admin {}
do-family: Calibri;
background-color: #EFEFEF;
text-align: center;
do-size: 16px;
}
. {Cabecalho2}
do-family: Calibri;
font size: 24 PX.
make-weight: bold;
text-align: center;
Color: #000;
}
{#inner}
overflow: auto;
height: 420px;
Width: 755px;
}
. {AP_Div}
do-family: Calibri;
font size: 24 PX.
color: #676767;
text-align: center;
make-weight: bold;
}
. Note {}
do-family: Calibri;
font size: 28px;
color: #900;
}
. {Of L'Escala
do-family: Calibri;
do-size: 18px;
color: #900;
text-align: center;
}

DevilUrd wrote:

Thanks for your response!

My main problem atm is on the height – width has already been authorized. And you set the values of % for width, but determined to fixed values for the height.

If I don't put any value on the height and only to fix width based on percentages, it does not work...

Or did I get it wrong?

The height is ALWAYS determined by the content, that is why you should never specify a fixed container height unless it contains an element of height fixed as an image, video or an iframe, etc.

What does not work if you remove the height values?

Tags: Dreamweaver

Similar Questions

  • How to adjust the website to work with several screen resolutions?

    http://www.allenkey.com.au/

    Hello, I recently designed this Web site and the formatting isn't correct when read with different screen resolutions

    Help please sélectionner!

    Hello, I recently designed this Web site and the formatting isn't correct when read with different screen resolutions

    Just so you know, and to keep clear wire, the resolution got nothing to do with the result by your page or is formatted.  A given page appear exactly the same on any screen resolution requirement to retain the same value in pixels the width of the browser.  This is the variation of the width of a screen to another resolution which causes the difference.  And Yes, it's the fact that you used absolute positioning as a method of main layout that is the problem for the reason that JTANNA has already been mentioned.

    Now - how do you want your page to behave?  Do you want to be centered and fixed width (that would be the easiest).  In this case, change this.

    on this subject.

    and this-

    on this subject.

    Now, all your containers AP reposition so that the page is again aligned the way you want, and you're done.

  • Adjustment of intro with movement to all screen resolutions!

    Hello!

    I would do an intro similar to that used in this site:

    http://www.melisa.gr/.  In other words, I want the logo appear first in the Center and then go to the left side of the screen for each screen resolution. How can I make a request for an object that will be always starts from the center of each screen resolution and ends on the left side of the screen for each screen resolution?

    Thank you!!!

    This is not true... "mc._width" is for AS2. "mc.width" is for AS3. If you use 'mc.width' in AS2, it will return undefined as the calculation will be false. Try to trace with mc.width, it should give undefined in AS2. Use mc._width.

    -------------------

    Ah I found the solution:

    Mx.transitions import. *;

    Import mx.transitions.easing. *;

    var nBrowserW:Number = Stage.width;

    var nBrowserH:Number = Stage.height;

    var nStageW:Number = 550;

    var nStageH:Number = 400;

    MC._x = (nStageW - mc._width) * 0.5;

    MC._y = (nStageH - mc._height) * 0.5;

    var nInitX:Number = nStageW * 0.5;

    var nFinalX:Number = mc._x - (nBrowserW * 0.5) + mc._width;

    var cLeftTween:Tween = new Tween (mc, "_x", Elastic.easeInOut, nInitX, nFinalX, true, 0.5);

    Just change the dimensions by default 550 and 400 to the dimensions of your document in case you do not use these default values.

  • Scroll bar adaptable animation to all screen resolutions?

    Hello

    Sorry for my English, I'm Italian and use google translator.

    I would like to ask a simple question and attach videos and files so as to be as clear as possible.

    I create my site on a screen 1920 x 1080, and worked with the resolution, but then you try the site on a screen type 1440 x 900 lower, I have seen that animation fits well in a resolution of 1440 x 900.

    I want to reach is that the bottom black bar is automatically displayed on the screen with lower resolutions.

    And ' since yesterday I have try and try again, but I just can't get what I want. It is possible to do?

    Can you give me a hand please? Thank you very much

    Video demo of the animation perfect up to 1920 x 1080:

    http://it.Tinypic.com/player.php?v=2mabti & s = 9 #. V3-bYGiLSUk

    Video demo of the animation is not perfect at 1440 x 900:

    http://it.Tinypic.com/player.php?v=2yy1g5e & s = 9 #. V3-bxGiLSUk

    Muse of file:

    http://www31.zippyshare.com/v/jbX5NK6n/file.html

    This is not possible with standard tools of Muse. You must write custom CSS + JS

  • Make the size of the police according to different screen resolutions

    Hi all

    I'm developing an application that needs to run on the two devices OS 6 and 7. There are a number of devices that fall into that category, I need to standardize the sizes of police across all screen resolutions.

    A few messages in the support forum, I understand that I need to use UNITS_pt as the police unit in order to standardize the size of police across all resolutions.

    But my client gave me sizes of fonts to use in pixels. Should have sizes from photoshop. What I need now, is to convert the font size of the pixels into points. I created a method that you can find below, for this conversion, but I don't know if it will work or not. I need an expert advisor.

    public static Font getFontPlain(int fontSizeInPixels) {
            try {
                fontFamily = FontFamily.forName("Helvetica");
            } catch (ClassNotFoundException e) {
                Logger.blackBerryErrorLog("Error creating font", e);
            }
            int size = Ui.convertSize(fontSizeInPixels, Ui.UNITS_px, Ui.UNITS_pt);
            Font font = fontFamily.getFont(Font.PLAIN, size, Ui.UNITS_pt);
            return font;
        }
    

    Any help on this will be appreciated.

    Thank you much in advance.

    "Should have sizes from photoshop".

    Unfortunately, it's a potential problem.  I've been in this situation before, and the size of the pixel depends on the size of the image that the designer uses to work up the screenshots.

    I had a designer who has very well used 72 dpi in the development of its screenshots and therefore the size of the pixel corresponding points, a point is 1/72nd of an inch.  This could be the case here.  What device has been the designer develops for and what size have been specified for the various policies?

  • How to site adapt to different screen sizes?

    How can I make my site fit in all screen sizes?
    Thank you
    -Bryan

    "BryanRob" wrote in message
    News:emsf4m$NHC$1@forums. Macromedia.com...
    > Here's what I have I made a site about this size in photoshop then saved
    > and
    > Put it in dreamweaver in a layer and moved the layer so it woul dbe
    > centered
    > then I added this code to get the backround colar
    > text = "#000000" > and then added another layer on top just to the text. Who am
    > I
    > doing wrong? Some say, it seems that some do not.

    What you're doing wrong?

    1 creation of the site in Photoshop (web sites should not be made entirely of)
    graphics card...)

    2. the use of Dreamweaver layers

    3. deprecated code in style using the background instead of CSS color...

    As much as what it looks like, obviously we cannot say anything unless we see...

    --
    Patty Ayers | www.WebDevBiz.com
    Free articles on the business of Web development
    Web Design contract, quote request form, estimate Worksheet
    --

    --
    Patty Ayers | www.WebDevBiz.com
    Free articles on the business of Web development
    Web Design contract, quote request form, estimate Worksheet
    --

  • Satellite M70 - screen resolution on gets of websites, bigger and bigger

    Eventhough my screen resolution is set to 1280 x 800 (I have Windows XP) when I use mozilla internet resolution (photos of letters all) is blondelot as it used to be for a reason that I do not know...

    Input and advice most welcome!

    Hello!

    I m not sure, but as far as I know this can be changed easily if you hold down the CTRL key and use the roller depending on the keyboard or external mouse.
    So, you can change the description of the websites.

    Check it!

    Good bye

  • Problem: Screen resolution & Lan adapt.

    Problem 1: Screen Resolution.
    First of all start, Windows 7 Home Premium 64-bit. Second boot, Windows 7 Home Premium 32-bit. Then I didn't work as it used to be. Now using, Windows 7 Ultimate 32-bit. After this install and reinstall, I was confused and didn't know what was my original using bits. : S (supposed to be 32-bit)

    Okay, so I was trying to backup D: drive and tries to start and do a clean install from disk wins7. But unfortunately, I had my iso installed with Windows7 Home Premium 64 - bit. FYI, I didn't know what Wins7 bit iso has been in the cd, so I just started it and installed with this 64-bit cd.

    Then I tried to change my screen resolution. There were two options: 800 x 600 and 1024 x 768. I changed it to 1024 x 768, but it will not work. It's weird. I went to Device Manager and checked on the Image adapter: Standard VGA graphics adapters.
    Problem 2: The Lan adapter.
    Cable connected to the modem, it flashes. but I could not simply go online, and I didn't know why. Is it lack of the new wins7? Or my adapter lan was broken?
    Don't let some answers, thanks in advance.
    Problem 1: Screen Resolution.
    First of all start, Windows 7 Home Premium 64-bit. Second boot, Windows 7 Home Premium 32-bit. Then I didn't work as it used to be. Now using, Windows 7 Ultimate 32-bit. After this install and reinstall, I was confused and didn't know what was my original using bits. : S (supposed to be 32-bit)

    Okay, so I was trying to backup D: drive and tries to start and do a clean install from disk wins7. But unfortunately, I had my iso installed with Windows7 Home Premium 64 - bit. FYI, I didn't know what Wins7 bit iso has been in the cd, so I just started it and installed with this 64-bit cd.

    Then I tried to change my screen resolution. There were two options: 800 x 600 and 1024 x 768. I changed it to 1024 x 768, but it will not work. It's weird. I went to Device Manager and checked on the Image adapter: Standard VGA graphics adapters.
    Problem 2: The Lan adapter.
    Cable connected to the modem, it flashes. but I could not simply go online, and I didn't know why. Is it lack of the new wins7? Or my adapter lan was broken?
    Don't let some answers, thanks in advance.

    Install the drivers.

  • Page of Yahoo mail that says 'there a screen resolution problem". A in case of problems with all stakeholders, even all the browsers. The question is Firefox!

    I have the latest version of Yahoo mail. When I click on the link "mail" of my Yahoo homepage, he directs me to a page that reads, "There is a problem of screen resolution". In the body of this page, it explains how to fix the problem. BUT, I don't have a problem with the resolution - the screen resolution should be 1024 x 600 or greater and IT IS! This only happens with YOUR browser. I have Chrome and IE, neither of which is a problem. I worked with a representative of the yahoo mail support and he explains that it IS a problem with Firefox and for raise you awareness and fix the problem - I use a Vista operating system on a computer and Windows 7 on my other computer, which has the same problem, so we KNOW for sure, it's a Firefox issue.

    I don't think that the effects of this question all those who use Firefox because I'm able to visit Yahoo Mail without any problems. I would say that to reset the zoom of the page on the page, this issue occurs on. You can do these steps go to view > Zoom > reset or press (Ctrl + 0 (zero).

  • How to get the resolution of all screens

    Hello, I am trying to get the screen resolution and the position (display two left or right of a display) all connected screens (normally two) of LabView 8.6. My idea was to take the .net 'system.windows.forms.screen' class, but there is no public constructor.

    Can someone help me?

    Best regards, Nicolas

    Hey,.

    You can use a propertynode on the class of application with the property "Display.AllMontiors".

    Christian

  • Screen resolution: how to adapt?

    How to set the resolution of the screen...

    Go to the Web site of the manufacturer of your laptop computer-graphics/computer card > drivers and downloads Section > key in your model number > look for the latest Vista drivers > download/install them.

    Then:

    http://Windows.Microsoft.com/en-AU/Windows-Vista/change-screen-resolution

    Change the screen resolution

    Screen resolution refers to the clarity of the text and images on your screen. At higher resolutions, items appear sharper. They appear also smaller, so more items adapted to the screen. At lower resolutions, fewer items adapted to the screen, but they are larger and easier to see. At very low resolutions, however, images may have serrated edges.

    See you soon.

    Mick Murphy - Microsoft partner

  • Screen resolution got really big and now I can't make normal.

    Screen resolution is too large.

    Hello

    Make sure that you are logged on as administrator.

    Use the system restore to a point before that happened.

    Start - Control Panel - restore and backup center - upper left repair Windows

    How to make a Vista system restore
    http://www.Vistax64.com/tutorials/76905-System-Restore-how.html

    ==========================================

    Right click on desktop - customize - display settings - Set resolution.

    Right click on desktop - customize - top left adjust font size (DPI)

    CTRL + mouse wheel works ZOOM

    CTRL + and CTRL - work ZOOM in and out

    Your mouse/touchpad probably incorporates a ZOOM to it.

    Your system also has a magnifier built in which could be a problem - it can also often be programmed
    to work on the mouse/keyboards.

    How to turn on the Magnifier On or Off in Vista
    http://www.Vistax64.com/tutorials/125037-Magnifier-turn-off.html

    To see if your mouse/touchpad is set to ZOOM or enlarge use Control Panel - mouse.

    The TouchPad also has Hotkey controls to verify with the help of machine to online system
    documentation and their forums, where appropriate.

    I hope this helps.

    Rob - bicycle - Mark Twain said it is good.

  • How to make my top screen resolution

    Hello

    I just bought a monitor 24 inch LG compatible IPS 1920 x 1200 display. However, in my settings, the highest is 1280 x 1024. My graphics card is also new, an MSI NVIDIA GEFORCE GTX 960. My operating system is Windows 7. How can I get my screen resolution up to 1920 x 1200? Helllllllp please.

    For your new 960 GTX you also go to the NVIDIA WWW site and download the current drivers (version 355.98).

    Their website is here and you can get them to automatically detect your GPU and suggest a driver or you can choose to download it yourself:

    http://www.GeForce.com/drivers

  • Photoshop elements 13 is incredibly tiny on my laptop it makes this useless application, I have a laptop 13 inch.  can you tell me how to make the largest application without changing my screen resolution?

    Photoshop elements 13 is incredibly tiny on my laptop it makes this useless application, I have a laptop 13 inch.  can you tell me how to enlarge the photoshop application without changing my screen resolution?

    Well good for Photoshop to fix this, I chatted with technical support and they have a new version of 13.1 to. I've updated, then went in the preferences and found the preference of the user interface, select 200%. Who did the trick.

  • My screen resolution is very high. How can I make things scale better without lowering the resolution?

    I can cover the word 'cat' with my mouse in command prompt. In Eclipse, I can hide the shortcut icons with a piece of pencil 0.9 mm. How can I fix this without compromising my or constantly squinting at my screen resolution?

    Hello

    Windows chooses the best settings of your PC based on your monitor screen. If you want to adjust your display settings, or if they have been changed and you want to restore the default settings, here are some things you can try.

    I suggest you try the steps from the following link:

    Get the best display on your monitor
    http://Windows.Microsoft.com/en-CA/Windows-8/get-best-display-monitor

    I hope this helps. Let us know if you have other problems with Windows in the future.

Maybe you are looking for