Resizing to a different liquid width

Dear Adobe community,

I'm building a website that is 1200 px wide and so I am making a liquid-type, which is a site that adapts to the web browser window.

I want to place two elements side by side that are also liquid.

Because I set the minimum width of the container to 800 px I don't want these items to always be next to another, as the web browser reduces its width to, or near, this width.

What I want to achieve is: when the web browser reaches a certain value, I want the right element positioned under the element to the left while increasing its width to take account of the white space that is created by this clearing.

I want to add the same function as www.nasa.gov has, then please, get to him and reduce the window of the web browser while keeping an eye on what happens when the elements to the right place below (they resize to another value of liquid).

In other words, how to achieve this effect can reach other values of width liquid (in percentage) after taking position on a vertical line?

Thank you very much!

Best regards

Andreas

Use a media query to apply different rules. Using queries in Dreamweaver visual media

Tags: Dreamweaver

Similar Questions

  • Resizable page for different sizes of screen, but with the content of the static image. I will use the query?

    I do a page that contains the content of the image for the most part. It's a big circle in the Middle, so I won't be centered vertically and horizontally. I also want to stay centered and resized proportionally for different screen sizes. I read at the request of the media, but it seems to me that the elements just become liquid. Can I do the elements remain in place using the media query?

    I'm working in Dreamweaver CS5.5

    I meant use 'z-index' selector CSS to the 'layer' your div on the page: http://reference.sitepoint.com/css/z-index/demo

  • adding table to the report: different column width

    Hello

    Is there a way to set different column width when the table is added to the report VI? As I understand it, the width is distributed in evently for the Table to add to the report VI.

    I have a table with 5 colunms and to set the width of each column differently for printing of the report.

    Thanks for your help

    H. Pham

    Dig into the Table to add to the report VI as a result of the entry of the column width, you will find the Table add to the report > add text table of report VI > tables.vi > Set Table column width VI. You will find a node invoke named SetColumnWidth. Simply enter the column number and the respective width for each column.

  • Batch resize images of different sizes

    Hello

    I hope someone can point me in the right direction.  In the past I've used the script to batch image processor resize images of same sizes, but now I have a few hundred images that are all different sizes.  I would like to resize these images so the long side of each image is resized to a specific size, while maintaining the current proportions.

    I'm using CS5.

    Thanks in advance for any help,

    Adam

    In the image processor dialog box, choose the format, select Resize to fit

    and enter 200 in the height and width of the boxes.

    Click the screenshot below to enlarge

    MTSTUNER

  • PS resize jpg (to fit the width of the doc) when import, but I don't want it to!

    Alert on the noob! :

    Say I have create a doc with a size A4, 300 p/po

    When I import a jpg on a layer file (drag and drop), PS automatically resizes the jpg to fit the horizontal width of the doc. Even if the jpg is massive, like the 5000 X 3000 pixels.

    This resizing seems to be non-destructive, so any info is rained on the jpg.

    BUT! : my question is: how to teach ch to import the jpg to its original size, as well as the jpg 1 pixel = 1 pixel in my doc?

    Thanks in advance!

    What is your Photoshop > preferences > General > Resize Image for cutlery?

  • Parallax Scrolls differently on different browser widths

    I spent a lot of time in scroll setting. (Select 'Menu' to see the scrolling) And it works fine when I saw in the browser. BUT the black bar does not match correctly (as in the screenshot) if the width of the browser is different. Is it possible that the black bar and menu text line up like this on the widths of different size browser?

    Here is the link of the site temp

    http://cafemaddalena.BusinessCatalyst.com/index.html

    Thank you.

    Screen Shot 2014-01-27 at 2.22.40 PM.png

    Hello

    Please try to adjust the parameters of the final request for the menu and the black bar as in the screenshot below:

    See you soon,.

    Vikas

  • Batch resize pictures to a given width?

    I have several photos I would like to scale proportionally to a given width. When trying to batch resize them it says that I need a width and a height. I can do with just a width of 1280 pixels and the heigh adjust result to keep the original proportion?

    Thank you
    Phil

    Make the size 30000 pixels in file > scripts > image processor.

  • How to resize controls to get the width

    Hi guys,.

    I will try to find a way to not hard code the width/height of the controls, checked a way to use 'USE_ALL_WIDTH' of bb4, but the DockLayout method, but the solution in this thread will not work, because I can not find DockLayoutProperties:

    is there properties such as USE_ALL_WIDTH or USE_ALL_HEIGHT

    So, how do you guys do when you need a control to get all the width of the screen size?

    Hello

    Suppose you want to give the width of button do as below:

    Container {
            layout: DockLayout {
            }
            Button {
                id: submitButton
                text: "Submit"
                onClicked: {
                }
    
                horizontalAlignment: HorizontalAlignment.Fill
                verticalAlignment: VerticalAlignment.Fill
    
            }
        }
    

    Do not include horizontalAlignment: HorizontalAlignment.Fill inside layoutproperty.

    Thank you

  • resizing of step changes the width of the Ellipse

    resized shape.PNGresized shape2.PNG

    When I adjust the stage size ellipses distort apparently in scale. But the size of the forms values remain the same.

    Why is this happening?

    Is there a way to change the width of the stage without affecting the size of the ellipses?

    Thanks in advance for your help.

    How do you change the size of the stage?

    And are the dimensions of the stage as well as the items on it are specified in % instead of px?

    HTH,

    Vivekuma

  • Width of the image resizing IE in div - CSS help please

    link: http://www.salmansolutions.com/about.html the bullets in the left navigation div are the issue. I tried resizing, using a different image chip which is more square, put online before the descriptive text, put the ball in the CSS list-style- image (blurred with a weird background makes). Can someone tell me why this happens and how to fix it?
    < div id = "hovernav" >
    < ul id = "navigation-left" >
    "< li = 'n-principles' id > < a href =" guidingprinciples.html"> < span > < img src =" dingbullet.png "alt ="ding"width ="20"height ="8"/ > principles </span > < /a > < /li >
    "< id li ="n-Gallery"> < a href =" gallery.html"> < span > < img src =" dingbullet.png "alt ="ding2"width ="20"height ="8"style =" width: 20px; height: 8px; "/ > </Span > < /a > < /li > Gallery
    "< id li ="n-experience"> < a href ="experience.html"> < span > < img src ="dingbullet.png"alt =" "width ="20"height ="8"style =" width: 20px; " height: 8px; ' / > experience </span > < /a > < /li > < /ul >
    < / div >


    style sheet

    {#list3}
    margin: 0em;
    padding: 0px 0px 10px-10px;
    text-indent:-14px;
    do-family: Georgia, "Times New Roman", Times, serif;
    do-size: 12px;
    }


    The best method with a graphics chip, frankly, is to make the
    no repetitive background of the list item and add a left padding to push
    the text to the right, for example,.

    Li {}
    background-image: url (whatever.jpg); background-repeat: repeat no.; padding-left: 20px; list-sty le-type: none;
    }

    The style of list-style-type is to completely eliminate fleas in the normal lists.

    --
    Murray - ICQ 71997575
    Adobe Community Expert
    (If you * MUST * write me, don't don't LAUGH when you do!)
    ==================
    http://www.projectseven.com/go - DW FAQs, tutorials & resources
    http://www.dwfaq.com - DW FAQs, tutorials & resources
    ==================

    "houstonalle" wrote in message
    News:g9gsni$CV2$1@forums. Macromedia.com...
    > link: http://www.salmansolutions.com/about.html bullets in
    > the
    > left navigation div are the issue. I tried resizing, using a different image
    > ball
    > It is more square, put in line in front of the descriptive text.
    > putting
    > the ball in CSS like list-style-image (makes it fuzzy with a weird
    (> background). Can someone tell me why this happens and how to fix it?
    >


    >
    >
    > stylesheet
    >
    > #list3 {}
    > margin: 0em;
    > padding: 0px 0px 10px-10px;
    > text-indent:-14px;
    > do-family: Georgia, "Times New Roman", Times, serif;
    > do-size: 12px;
    > }
    >
    >
    >
    >

  • Preview App make blank photos resize

    I posted this question to the/thread/7411494, it's actually very different, so I'll try again here.

    First of all,

    (20 inch, early 2008), iMac OS X 10.11.2 (15 c 50)

    Get an overview of Version 8.1 (877.7)

    1. open a jpg file that I downloaded from my camera in order to resize the image.

    2. I save a duplicate with SHIFT-command-S. I rename or choose the default 'file name + copy,' or material.

    3. I go to tools > set size and change of 4000 x 3000 pixels to 1000 x 750 (proportionally scale and resample the image checked).

    4. the photo disappears and the window goes all gray. If I save it, the tile in the Finder window shows a white jpg. If I discover 'Real size' or 'Zoom to adjust', the photo appears again in the preview window, but the thumbnail still shows a white jpg. If I recorded with these changes, that does not change. If I close it, then reopen, it is indeed a jpg all white with no pictures.

    I tried resizing for other sizes, and I get different results. For example if I resize to a 3000 pixels width, gray window the bottom 3/4 or so of the photo, but there's a bunch of type banner from the top of the photo. But if I can save and close this jpg, I can open it, and it looks normal, with dimensions of 3000 x 2250. If I resize this one up to 2000 pixels wide, it creates a jpg all white.

    If I resize the original to 3000 px in width, save, then resize back to 2500 px in width, it actually records a jpg file with a narrow strip portrait of the visible picture on the right, the rest white.

    This problem will not occur in Mode without failure.

    I deleted all the applications Adobe, empty the trash, shut down, restarted, and the problem remains.

    Any ideas?

    Thank you

    Rich

    A test,

    • Download your image to your Mac
    • Open it in Photos App
    • resize it & save

    The joy?

  • Indicator automatic resizing of string with carriage returns in the chain

    I try to have a string on my front indicator automatically resize to put different strings that are sent to it.

    I found the function 'Get the Rect.vi text' and it seems to do exactly what I want, but only for the first line of my string.

    It is not resized to display characters after a carriage return / newline.

    Here is a picture of the chain resized automatically next to a picture of the complete string that I size manually.

                       

    How do I autosize my chain indicator box to include all of my text?

    The node to invoke "Text size" would work?

  • How to resize avatar 180 pixels wide to accommodate the requirement of FB

    What is the best way to resize an avatar stock 180 pixels wide to accommodate the mandatory picture of FB?

    Thank you.

    Right click on the image and choose "open with > Paint.

    In the Paint toolbar, click resize.  Choose your new width in pixels.

    Click OK, and then save your image.

  • BlackBerry 5 - image with text and the background transparent resizing

    Hey,.

    My application consists of a series of images stacked on each other. Some are transparent, some are not. I use images high resolution and resize them based on the width of the screen of the blackberry that runs the application.

    I'm having some trouble resizing of images with text on a transparent background. The resulting image is not of all anti-aliasing. This is the code I use to do:

    function scaleBitmap(Bitmap bmp){
    
    int rgb[] = new int[imageWidth * imageHeight];
    bmp.getARGB(rgb, 0, imageWidth, 0, 0, imageWidth, imageHeight);
    int rgb2[] = rescaleArray(rgb, imageWidth, imageHeight, width, height);
    scaledBmp.setARGB(rgb2, 0, width, 0, 0, width, height);
    
    return scaledBmp;
    }
    

    And here are the results from a group of images resized in photoshop:

    Is it possible that I could improve my resize code to give better results?

    Thanks in advance!

    I found a solution and it is on these forums all the time!

    http://supportforums.BlackBerry.com/T5/Java-development/solution-for-properly-resizing-transparent-b...

  • How to resize image

    Hi all

    I'm new to the blackberry development. Actually I want to resize the image based on the width and height of the screen.

    I like to write code for all devices, such as the image resize itself based on the width and height of the device.

    Can someone provide me with a snippet of code for resizing of the image?

    Thank you

    Here is an example on how do

    public static EncodedImage ScaleImageToSize (image, int targetWidth, targetHeight int EncodedImage)
    {
    If (targetWidth > 0 & targetHeight > 0)
    {
    int imageWidth = image.getWidth ();
    int imageHeight = image.getHeight ();
    float scaleX = ((float) imageWidth / (float) targetWidth) * 10000;
    float scaleY = ((float) imageHeight / (float) targetHeight) * 10000;

    int fixedX = Fixed32.tenThouToFP (scaleX (int));
    int fixedY = Fixed32.tenThouToFP ((int) scaleY);
    EncodedImage retImage = image.scaleImage32(fixedX,fixedY);
    Return retImage;
    }
    return image;
    }

    You can also add her manipulation of proportions.

    I hope this will help.

    Rab

Maybe you are looking for