Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Cross Browser Layout - Safari Giving Me Trouble

Hi Guys, hope you can help.

So I'm using flexbox to layout a new website. I realise it has its issues so I am using a combination of things including autoprefix library in sublime to help me get it working across all browsers. So far it displays perfectly in FF and Chrome but for some reason Safari is giving me most trouble.

My main problem at the minute is that Safari doesnt seem to be inheritiing the width of divs from their parents. For example;

I have a main content div set to 80% I have two divs inside this dividing the 80% in two. Lets say 20% and 80%. FF and Chrome render this correctly dividing the div but Safari renders it ignoring the main content 80% and adds the widths together to 100%.

Is this because safari doesnt play nice with % based measurements?

Should I use a different measurement for responsive layout?

Jason.

2 Answers

Should I just include that as a stylesheet above my main stylesheet in my html?

Thanks for pointing me to this.

J