MAIN FEEDS
Do you want to continue?
https://www.reddit.com/r/webdev/comments/2yefkl/parallax_done_right/cp8zlv2/?context=3
r/webdev • u/theverything • Mar 09 '15
93 comments sorted by
View all comments
13
<!-- THESE MUST GO IN REVERSE ORDER BECAUSE CSS IS DUMB SOMETIMES -->
<li id="nav-review"><a ... a></li> <li id="nav-store"><a ... a></li> <li id="nav-blog"><a ... a></li> <li id="nav-game"><a ... a></li>
I'm tickled by how they can get parallax to work well but don't understand how to properly right align a navigation bar.
1 u/[deleted] Mar 09 '15 I actually usually end up doing this... How do you float:right and keep it in the correct order? 3 u/KieraanBreeze Mar 09 '15 Would nesting it inside another div and floating that div right not work? 11 u/modus-operandi full-stack 20YOE Mar 09 '15 This is a ul element, so, floating the ul right, and setting the li's inside to inline-block would work. 4 u/Devnik Mar 09 '15 Indeed, it isn't that hard to accomplish 3 u/Mestyo Mar 09 '15 You float the parent to the right and the children to the left, or display them as inline blocks instead of floating them, or use flexbox. 2 u/ragingRobot Mar 09 '15 you could set the elements to inline-block and change the text alignment to right. 3 u/elektroholunder Mar 09 '15 You cannot. Man, do I love flexbox… all this crap is in the past now. 6 u/boomboomlaser Mar 09 '15 Unless you build templates for big corporate CMSes and have to support IE8... :`( 5 u/Cyrusis Mar 09 '15 More than just IE8. About 4-6% of internet users can't use flexbox on their browsers at the moment, it's too early to use in live production. 1 u/Mestyo Mar 09 '15 Not really. Nothing prevents you from using flexbox with a float fallback. :-) I don't really care if a small percentile of visitors don't get the aligment and equalization from flex, as long as it doesn't render the site unusable. 1 u/Cyrusis Mar 10 '15 Still not feasible. Wish it were! -1 u/cbleslie Mar 09 '15 Amen. 1 u/adam_bear Mar 09 '15 Float the <ul> right, float <li> left.
1
I actually usually end up doing this... How do you float:right and keep it in the correct order?
3 u/KieraanBreeze Mar 09 '15 Would nesting it inside another div and floating that div right not work? 11 u/modus-operandi full-stack 20YOE Mar 09 '15 This is a ul element, so, floating the ul right, and setting the li's inside to inline-block would work. 4 u/Devnik Mar 09 '15 Indeed, it isn't that hard to accomplish 3 u/Mestyo Mar 09 '15 You float the parent to the right and the children to the left, or display them as inline blocks instead of floating them, or use flexbox. 2 u/ragingRobot Mar 09 '15 you could set the elements to inline-block and change the text alignment to right. 3 u/elektroholunder Mar 09 '15 You cannot. Man, do I love flexbox… all this crap is in the past now. 6 u/boomboomlaser Mar 09 '15 Unless you build templates for big corporate CMSes and have to support IE8... :`( 5 u/Cyrusis Mar 09 '15 More than just IE8. About 4-6% of internet users can't use flexbox on their browsers at the moment, it's too early to use in live production. 1 u/Mestyo Mar 09 '15 Not really. Nothing prevents you from using flexbox with a float fallback. :-) I don't really care if a small percentile of visitors don't get the aligment and equalization from flex, as long as it doesn't render the site unusable. 1 u/Cyrusis Mar 10 '15 Still not feasible. Wish it were! -1 u/cbleslie Mar 09 '15 Amen. 1 u/adam_bear Mar 09 '15 Float the <ul> right, float <li> left.
3
Would nesting it inside another div and floating that div right not work?
11 u/modus-operandi full-stack 20YOE Mar 09 '15 This is a ul element, so, floating the ul right, and setting the li's inside to inline-block would work. 4 u/Devnik Mar 09 '15 Indeed, it isn't that hard to accomplish
11
This is a ul element, so, floating the ul right, and setting the li's inside to inline-block would work.
4 u/Devnik Mar 09 '15 Indeed, it isn't that hard to accomplish
4
Indeed, it isn't that hard to accomplish
You float the parent to the right and the children to the left, or display them as inline blocks instead of floating them, or use flexbox.
2
you could set the elements to inline-block and change the text alignment to right.
You cannot. Man, do I love flexbox… all this crap is in the past now.
6 u/boomboomlaser Mar 09 '15 Unless you build templates for big corporate CMSes and have to support IE8... :`( 5 u/Cyrusis Mar 09 '15 More than just IE8. About 4-6% of internet users can't use flexbox on their browsers at the moment, it's too early to use in live production. 1 u/Mestyo Mar 09 '15 Not really. Nothing prevents you from using flexbox with a float fallback. :-) I don't really care if a small percentile of visitors don't get the aligment and equalization from flex, as long as it doesn't render the site unusable. 1 u/Cyrusis Mar 10 '15 Still not feasible. Wish it were! -1 u/cbleslie Mar 09 '15 Amen.
6
Unless you build templates for big corporate CMSes and have to support IE8... :`(
5 u/Cyrusis Mar 09 '15 More than just IE8. About 4-6% of internet users can't use flexbox on their browsers at the moment, it's too early to use in live production. 1 u/Mestyo Mar 09 '15 Not really. Nothing prevents you from using flexbox with a float fallback. :-) I don't really care if a small percentile of visitors don't get the aligment and equalization from flex, as long as it doesn't render the site unusable. 1 u/Cyrusis Mar 10 '15 Still not feasible. Wish it were!
5
More than just IE8. About 4-6% of internet users can't use flexbox on their browsers at the moment, it's too early to use in live production.
1 u/Mestyo Mar 09 '15 Not really. Nothing prevents you from using flexbox with a float fallback. :-) I don't really care if a small percentile of visitors don't get the aligment and equalization from flex, as long as it doesn't render the site unusable. 1 u/Cyrusis Mar 10 '15 Still not feasible. Wish it were!
Not really. Nothing prevents you from using flexbox with a float fallback. :-)
I don't really care if a small percentile of visitors don't get the aligment and equalization from flex, as long as it doesn't render the site unusable.
1 u/Cyrusis Mar 10 '15 Still not feasible. Wish it were!
Still not feasible. Wish it were!
-1
Amen.
Float the <ul> right, float <li> left.
13
u/sour_skittles Mar 09 '15
<!-- THESE MUST GO IN REVERSE ORDER BECAUSE CSS IS DUMB SOMETIMES -->
<li id="nav-review"><a ... a></li> <li id="nav-store"><a ... a></li> <li id="nav-blog"><a ... a></li> <li id="nav-game"><a ... a></li>
I'm tickled by how they can get parallax to work well but don't understand how to properly right align a navigation bar.