to fit images in a 10:8 viewbox (height: 100% or width: 100%)
Oddly enough I can add the $image->ratio() but not compare
$total_ratio = 0;
//logo-panel
// Alle Elemente sollen eine gleiche Höhe aufweisen und nebeneinander auf eine Gesamtbreite von 100% kommen.
// ermittle für jedes Element das Seitenverhätnis ($ratio)
// addiere alle Werte ($total_ratio)
// all elements should have the same hight and have together 100% width
// get the element ($ratio)
// add al values ($total_ratio)
foreach($members as $member) :
if($image = $member->image($member->logo())):
$ratio = $image->ratio();
$total_ratio += $ratio;
endif;
endforeach;
//Element Breite = (100% / $total_ratio * $ratio)
//Element width = (100% / $total_ratio * $ratio)
foreach($members as $member) :
if($image = $member->image($member->logo())):
$ratio = $image->ratio();
$percentWidth = number_format((100/$total_ratio) * $ratio,4,'.','');?>
<div class="logo-container" style="width: <?php echo $percentWidth ;?>%">
But I’am no php developer, I’am just learning by doing because of kirby.
Although, if you change this for numbers in general, it will of course effect all numbers. So depending on your use case, changing the number format might be the way to go.
Yes, but pls. keep in mind that this setting will change all floating numbers, so if you want to show prices or whatever, they will also use dot decimals, which is probably not what you want. If you don’t use any other floating numbers, you are fine, though.
Ah, I didn’t see that. In those cases you should always use number_format. Using that function will tell PHP the exact format you require and will make you independent from your locale settings. Normally it makes sense to output locale-aware number formats (in every location where the user sees the value directly), but in those CSS value edge-cases you need to tell PHP explicitly.
Hint:
I don’t understand, why you want to use “1.25” instead of “1” for “THIS” border between these ratios (portrait and landscape). I think this border should be 1 :
Hello @anon77445132,
My Viewbox has the propotion of 10:8 in order to fit better the ratio of a monitor, I don’t wanted a portrait format cut off at the bottom by the screen.
So, if I would take “1”, a image with a ratio of “1.1” get declared as “landscape” and takes 100% of available width – and get cut off at the top and the bottom in my 10:8 scenario.
My rules for @media screeen and (orientation: portrait)
are exactly the other way round.