- This topic is empty.
June 23, 2014 at 8:42 am #173475
I am working on a site and it is set to be Responsive with small screens as the basis and then expand to columns after 40em. I have 2 issues that are driving me crazy.
First is that the FlexBox height is not working across the 3 columns.
Secondly, the responsiveness of FlexBox is working on software emulators or if you make your browser window smaller but when you actually go to the website on the phone, you get 3 columns.
Here’s a demo to FlexBox code – https://gist.github.com/anonymous/4c03c18f37cf3951a0a7
and here’s a link to the test area – http://stepknows.server311.com/testarea/ – with the other bells and whistles
Any help would be greatly appreciated.
StephJune 23, 2014 at 8:54 am #173477Paulie_DMember
and here’s a link to the test area –
It would be easier if you put this into a Codepen.io example.
We hate having to debug by using Developer Tools.June 23, 2014 at 9:36 am #173489nixnerdParticipant
Yeah, please make a Codepen. I’ve been working A LOT with flexbox the last few days… so I might be able to help you.June 23, 2014 at 5:32 pm #173507
Thanks much. I did earlier but excuse my ignorance but the only way to share was by creating a Gist and/or downloading a .zip or signing up for Pro version
In my stress, am I missing something ?June 23, 2014 at 10:48 pm #173515
This does work I just tested.
Ok so when I copy the link into Codepen it works great.
But I’m still having some issues namely FlexBox height is no longer working aarrrgghhhh
Plus when you check it on a physical mobile device it does not reduce to 1 column but on software emulators it does and also on minimizing the screen
Thanks for taking a look
KathyJune 24, 2014 at 2:33 am #173531Paulie_DMember
Obviously, something is not working with your Codepens because they aren’t getting saved.June 24, 2014 at 5:07 pm #173614
Okay – stress has been reduced.
Heres my Codepen (I swear sometimes it’ just one of those kind of weeks !)
Sorry about all the confusion
So again my issue is two fold:
Column heights are not the same
When you minimize the browser or use mobile emulators the site is one column wide on mobile devices (< 40ems), which is what I want but when you actually use a mobile device – then its the same as you see on a bigger device. – 3 columns wide
I am sure I am missing something completely obvious but I cant see it so any help would be appreciated.
sorry for the confusion with my codepen
Thanking you in advance
- The forum ‘CSS’ is closed to new topics and replies.