Sohail
Sohail

Reputation: 548

Safari position fixed, flexbox doesn't get positioned well

So my logo doesn't go to the left properly in Safari browser only, I was wondering what's wrong with it

thanks

Upvotes: 0

Views: 1104

Answers (2)

Sohail
Sohail

Reputation: 548

the thing is if you use flex-direction: column; in Safari , you have to also mention flex-wrap: nowrap; otherwise it will add the width of each flex-item to it's parent container, thanks to Sergey for hinting that.

Upvotes: 0

Sergey Khmelevskoy
Sergey Khmelevskoy

Reputation: 2544

For the flex container always use prefixes (which you already do).

If you want to align logo to the left, simply add

flex-wrap: nowrap;

Another good practise with flexboxes for safari is always use flex property. like so

  -webkit-box-flex: 1 1 auto;
  -moz-box-flex: 1 1 auto;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;

P.S. This might be an good article to start with

Upvotes: 1

Related Questions