Calculate width in scss - css

I have a little question, I don't understand what does it mean in css file
(100% - 60px) / 2) = ?????
Thanks for help

(100% - 60px) / 2) = ?????
in CSS the syntax to this expression will be :
calc(calc(100% - 60px)/2);
which means :
let's suppose we are talking about a property such as width, then for the current element in which we are writing this CSS, its width will be equal to px value of(100% of parent width) minus 60 px and its output divide by 2, then the result will be converted back to % and that will be the %value of width of Current element.
and the other way :
(100% parent width) = X px;
X px - 60 px = Y px;
(Y px converted to %) = Z %;
z % / 2 = result in %;

Related

How to split image into square parts? (formula)

I know image size and needed count of parts.
For example, image: 9000x6000 (px), needed count of parts: 1000. What will be the formula for getting a square size?
Let dimensions are Width, Height, needed count is n and unknown size is x
Every row of grid contains
nr = Floor(Width / x) // rounding down
Every column contains
nc = Floor(Height / x)
Write inequality
n <= nc * nr
n <= Floor(Width / x) * Floor(Height / x)
and solve it (find maximal possible x value) for unknown x
Use initial approximation
x0 = Ceil(Sqrt(Width * Height / n)) //rounding up
and decrement x value until inequality becomes true

Dynamic button sizing for undefined number of elements

I have a web app that displays an undefined amount of buttons in a large div (where the height is set to height: calc(100vh - 260px); and width is width: 100%). It can be anywhere between 20-300 buttons in this div. The buttons are always squares with a bit of margin in between each.
I'm currently kind of cheating this by doing this (x, y and z all in pixel values):
if buttonCount < 50 {
height = x
width = x
} else if buttonCount < 150 {
height = y
width = y
} else {
height = z
width = z}
Where x > y > z. Is there a way to dynamically size the undefined amount of buttons so that they're an equal size and fit within the div?

Manipulating a fraction

I know this isn't really a computing question (more of a maths problem), however it will lead on to scaling screen resolutions.
I am faced with equation for scaling a image scale = desired height / current height
Example shows to find the scale of desired height = 3 current height = √3 / 2
Scale = 3 / (√3 / 2)
The example states this is equal to 3 * (2 / √3)
Can anyone please shed some light to how they got from 3 / (√3 / 2) to 3 * (2 / √3)
Thanks
Let:
x = p/q
y = r/x
You can transform:
y = r/x <=> y*x = r
Then you substitute the value of x:
y*x = y*p/q = r
Which itself transforms to:
y*p = r*q
Which eventually become:
y = r*q/p

Qt - How does this center the window

I saw an example that uses the following to create a point that will be used to centre a window in Qt:
x = (screenWidth - WIDTH) / 2;
y = (screenHeight - HEIGHT) / 2;
Provided that screenWidth and screenHeight are found using the width() and height() functions respectively of QDesktopWidget.
How does the preceding code centre the window? Yes, I know it centres the window, but couldn't understand it from a calculation point of view.
Thanks.
First calculate the total amount of 'extra' horizontal space around your window:
extra_space = screenWidth - your_window_width
now, spread that space at left and right:
left_space + right_space = extra_space
the space at both sides should be the same:
right_space = left_space
==> 2 * left_space = extra_space
==> 2 * left_space = screenWidth - your_window_width
==> left_space = (screenWidth - your_window_width) / 2
that's your x. The same goes for the y coordinate.

Why does this produce a stretched Fractal?

Here is pseudo-code of how I setup an array representing the MandelBrot set, yet it becomes horribly stretched when leaving an aspect ratio of 1:1.
xStep = (maxX - minX) / width;
yStep = (maxY - minY) / height;
for(i = 0; i < width; i++)
for(j = 0; j < height; j++)
{
constantReal = minReal + xStep * i;
constantImag = minImag + yStep * j;
image[i][j] = inSet(constantReal, constantImag);
}
Thanks!
Here is pseudo-code of how I setup an array representing the MandelBrot set, yet it
becomes horribly stretched when leaving an aspect ratio of 1:1.
xStep = (maxX - minX) / width;
yStep = (maxY - minY) / height;
Aha! It's because you must keep the same aspect ratio both for the image you will draw and for the region of the complex plane you want to draw. In other words, it must hold
width maxX - minX
---------- = ---------------------
height maxY - minY
(It follows that xStep == yStep.) Your code probably does not enforce this requirement.
Make sure your casts are all correct. xStep and yStep might be the products of integer division instead of the expected floating point division (if that's C# in your sample, it would require some explicit casts to work correctly).
It probably has to do with how you are displaying the image array. You use the width variable i as the first index, but usually the first index should be the slowest changing, that is, the height.
Try changing the last line to image[j][i] = ...

Resources