Menu
So, i have some code with container as a flex and have justify-content: right; as the property and value in the CSS, and this makes the child element go to right side of container only in firefox, it's weird, because from some references such as CSS-tricks or W3school this value is invalid or it's not exist and the correct value is justify-content: flex-end;. If you see this question from firefox, you must be notice that the text align to the right. Then again, why the justify-content: right; works in firefox? or it's just a bug?
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<style>
section {
display: flex;
justify-content: right;
}
.text {
width: 50%;
}
</style>
</head>
<body>
<section>
<div class="text">To change the way a picture fits in your document, click it and a button for layout options appears next to it. When you work on a table, click where you want to add a row or a column, and then click the plus sign. Reading is easier, too, in the new
Reading view.</div>
</section>
</body>
</html>
702
See browser compatibility at this page. Firefox is currently the only browser that supports using left and right. Better to stick with flex-end so it works in all browsers.
80
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
