Questions tagged [aspect-ratio]

The aspect ratio of an element describes the proportional relationship between its width and its height.

The aspect ratio of an element describes the proportional relationship between its width and its height.

enter image description here

It is commonly expressed as two numbers separated by a colon, as in 16:9. For an x:y aspect ratio, no matter how big or small the element is, if the width is divided into x units of equal length and the height is measured using this same length unit, the height will be measured to be y units.

For example, older square box tv's are typically 4:3 aspect ratio (or 1:1.33). This translates to meaning basically, for every 4 pixels across, 3 pixels are down. We can extrapolate from that, a standard-definition tv screen is commonly 640 x 480 pixels.

  • 4:3 is used for many computer monitors and older, non-widescreen televisions.
  • 1:1 is an uncommon square-format aspect ratio occasionally used in photography.
  • 5:4 is a computer monitor resolution, now more commonly used in mobile telephone cameras.
  • 16:9 is the aspect ratio used for High Definition television, as well as movies.
  • 14:9 is a compromise aspect ratio used to create a picture acceptable to both 4:3 and 16:9 televisions.
  • 16:10 is utilized in the majority of widescreen computer monitors.

16:9 aspect ratio

The main advantage of a 16:9 aspect ratio is that it is the standard that High Definition content is output at. This makes it vital if you plan on watching High Definition movies or sports, especially as these are now becoming increasingly more available. This is primarily due to the declining cost and growing popularity of Blu-Ray players, as well as the fact that many governments are actively encouraging television companies to make HDTV broadcasts available. The 16:9 aspect ratio is particularly appropriate if you watch many modern films on a home movie theatre since most movies are now produced in 16:9 format.

4:3 aspect ratio

While the 4:3 aspect ratio is viewed as somewhat dated, it is still very common and is still the standard aspect ratio for computer screens. While it is true that High Definition content is becoming more and more prevalent, the majority of broadcasters still output in a 4:3 aspect ratio. While the same cannot be said for films, if you still watch a lot of VHS tapes of older films then a 4:3 television will allow for the image to take up the screen. Displayed on a 16:9 television it would appear stretched, or would have black borders running along the edges.

Common Device Aspect Ratios

| 4:3    |   3:2       |    16:10        |     17:10    |    16:9   |
| iPad 1 | iPhone 3GS- | Windows Phone 7 | Galaxy Tab 7 | Nokia C7  |
| iPad 2 | iPhone 4    | Google Nexus    |              | MeeGo N9  |
| iPad 3 | iPhone 4S   | Galaxy 10.1     |              | iPhone 5  |
| iPad 3 |             | Motorola Xoom   |              |           |
|        |             |                 |              |           |
1187 questions
-1
votes
1 answer

How to obtain aspect ratio from .avi file in c#

I have been provided with a .avi movie and i have to display it using DirectShow lib. So i am using a pictureBox to display bitmap image frame by frame but I want to maintain Aspect Ratio. How to do this in Windows Form. Thanks in advance. Edit: I…
-1
votes
1 answer

Unexpected ambiguity in image aspect-ratio

I have recieved by email, than downloaded, the picture that you can see opened with Photoshop in the screenshot below. That picture was created - and was meant to remain - wider than high. How come Photoshop "sees" its height bigger than its…
MattAllegro
  • 6,455
  • 5
  • 45
  • 52
-1
votes
3 answers

Re sizing an image in imageView

I want to define maxHeight for an image that it's adjustViewBounds has been set to true. in this way adt automatically keeps aspect ratio. is there any way to gain this approach without keeping aspect ratio? this is the image, and i want to stretch…
Branky
  • 373
  • 8
  • 23
-2
votes
1 answer

CSS grid with fluid dimensions, shrink content while keeping their aspect ratio

I want this auto grid to expand and shrink with the browser, while keeping the items centered in it, preserving their aspect ratio. Ideally : Pure CSS Keeping grid in "auto" mode (no template) (I know use-case might sound dumb, but this is…
Cyril CHAPON
  • 3,556
  • 4
  • 22
  • 40
-2
votes
1 answer

Convert Centroid points generated at Image Size 640 * 640 (image size) to size 622*1186 (image size)

I want to convert point (i.e 622,622) coordinates to other dimensional coordinates (622*1186) Using OpenCV. i.e I currently plotted the data at Image Size 640 * 640. Now I want to plot it at 622*1186 Image size. I want to know the formula so that I…
-2
votes
1 answer

MS Teams support for Ultra-Wide (21:9) monitors

I would like to switch to single Ultra-Wide monitor (21:9 ratio) instead of having few smaller monitors. During my work I often present using MS Teams but when sharing the whole desktop (I'm switching between many applications, so I can't share a…
-2
votes
1 answer

Auto-resizing a DIV on window resize based on a set aspect ratio

I'm trying to figure out how to create a div that has a set aspect ratio (such as 4:3) and automatically resizes itself (i.e. width and height check link below) when resizing the window, without ever changing the ratio. The div should behave exactly…
Estarossa
  • 585
  • 4
  • 21
-2
votes
1 answer

Libgdx viewports integration

Can someone just give me a real quick answer on how i would implement a viewport so this sprite would fill the whole screen? Thanks Current code (not working): public SplashScreen(Jump game) { this.game = game; cam = new…
Adam Brodin
  • 63
  • 1
  • 2
  • 13
-2
votes
1 answer

PHP fit any size image to 16:9 aspect ratio

Good noon, I'm currently trying to understand how i can crop image already loaded on server with 16:9 aspect ratio. For better understandig, if I have 4:3 image i have to cut top and bottom image portions to fit it into 16:9 ratio. Thanks.
Maksym Sadovnychyy
  • 175
  • 1
  • 4
  • 17
-2
votes
2 answers

Showing pdf in Xamarin apps

I'm developing appilcation for iOS and Android using Xamarin. I found some information, but I can't fully understand, how can I show pdf. Firstly, should I really pay for XFINIUM.PDF Mobile Standard Edition? As I understood, it is special Xamarin…
lenden
  • 800
  • 2
  • 14
  • 38
-2
votes
1 answer

PHP resize image keeping aspect ratio to exact size

I need to manually find DPI of new image. $input_width = 361; $input_height = 413; $input_dpi_x = 72; $input_dpi_y = 72; $output_width = 800; $output_height = $input_height * $output_width / $input_width; $output_dpi_x = ceil(($input_dpi_x /…
John Smith
  • 681
  • 5
  • 13
  • 30
-3
votes
1 answer

How to find the aspect ratio of a view programmatically?

enter image description hereenter image description here I have added the two images(Both are different width iPhone one is 375width and another is 414width, I know design is messing up because of the height is given according to the width of the…
-3
votes
2 answers

Calc Different video sizes with same aspect ratio

How i can generate a list with four items which should all have the same aspect ratio all depends on the original resolution of 480x360 ? The original aspect ratio 480x360 Also belonging to the list. Youtube has an example on it open any video click…
Sascha Heim
  • 301
  • 1
  • 4
  • 15
-3
votes
2 answers

Need an auto resize for div height with width change

Hi i need a script to check a div size constantly, automatically resizing the div height to sustain the aspect ratio (3.2) when a window is resized. Here is what I came up with for jQuery, but I am not sure how to get it to work. The initial size…
Benjaroo
  • 271
  • 3
  • 3
-4
votes
1 answer

How to reduce blob using aspect ratio?

I have a binary image with 4 blobs. 3 of them has an aspect ratio of more than 1. and 1 has aspect ratio of 1. Now I want to reduce that blobs which aspect ratio more than 1 in binary image. How could i do this. Can some one please provide a…
Dominic
  • 47
  • 5
1 2 3
79
80