# Positioning question **URL:** \ **Category:** Beginners\ **Created:** [January 21, 2018, 2:18am UTC](https://forum.pinegrow.com/t/positioning-question/1528 "2018-01-21T02:18:17Z")\ **Posts on this page:** 6\ **Page:** 1
**Author:** ![ladlon](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/ladlon/32/928_2.png) [@ladlon](https://forum.pinegrow.com/u/ladlon)\ **Post date:** [January 21, 2018, 2:18am UTC](https://forum.pinegrow.com/t/positioning-question/1528/1 "2018-01-21T02:18:17Z")
Hi. I have been hand coding my websites up to now, and am having a little trouble adjusting to using Pinegrow for some things (…plus, I’m also now using features I previously was not using, not aware of, or outright avoiding!). So, I’m currently battling both learning all aspects of the interface as well as the CSS/Bootstrap features themselves. So, one thing that seems to often slam me to a screeching halt, is certain aspects of positioning. An example… I have a 2 column setup (using a container, holding a row, holding two columns, each wtih an image). The first image is (say) 400x400, and the second is 200x100. I can set all that up, and the result is two columns, with the second column’s image sitting at the top of the space (as if aligned to the top). I have been trying to get that 200x100 image to position into the center of the space, but seemingly EVERYTHING I have tried has no result. Admittingly, I’ve always struggled with positioning/alignment… where it seems the results are almost random, sometimes working, other times having no effect). I have tried a number of things in the visual editor… the ‘vertical alignment’ attribute, the Position attibutes, etc… for the image element itself, for the column that contains it, etc. I just can’t seem to figure out what is the correct element to apply the change to, nor what method I should be using. I thought, perhaps, that the containing partent was automatically sized to the dimensions of the image, so that (as a result) the image had nowhere to actually move… so, I gave the containing parent a specific (large) height, giving the image space to move around… but still, no attribute adjustment seemed to cause the image to move from it’s top-aligned position. So, I’m a bit stumped… Can anyone point me in the right direction? Again, my setup was: Container Row Column1 Div (…I tried it without the containing Divs as well) Image1 (400x400) Column2 Div Image2 (200x100) (…Ya, I closed all the tags and stuff. This is just a simplified outline of the tree) And, again, I’m wondering how to position the second (smaller) image within the containing column (ex. vertically center it). The only way I eventually managed to get it to actually move, was to apply a top padding… but I wasn’t sure if this was the proper way to do it (…I wasn’t sure if setting a fixed, pixel based distance down would be an issue when it, and the larger image beside it got scaled down for smaller screens… although, I suppose I could customize the top move amount for each break point?) ---
**Author:** ![Pinegrow\_User](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/pinegrow_user/32/4919_2.png) [@Pinegrow\_User](https://forum.pinegrow.com/u/Pinegrow_User)\ **Post date:** [January 21, 2018, 3:01am UTC](https://forum.pinegrow.com/t/positioning-question/1528/2 "2018-01-21T03:01:03Z")
You can use FlexBox [https://www.google.com/search?q=display%3A+flex%3B+align-items%3A+center%3B](https://www.google.com/search?q=display%3A+flex%3B+align-items%3A+center%3B) ``` display: flex; align-items: center; ``` Otherwise use another alternative as you see fit: [https://www.google.com/search?q=center+align+vertically+bootstrap+column](https://www.google.com/search?q=center+align+vertically+bootstrap+column) * * * Google is a developers friend, very rarely are you the first having the issue, search, then search some more! ---
**Author:** ![ladlon](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/ladlon/32/928_2.png) [@ladlon](https://forum.pinegrow.com/u/ladlon)\ **Post date:** [January 21, 2018, 3:41am UTC](https://forum.pinegrow.com/t/positioning-question/1528/3 "2018-01-21T03:41:13Z")
Ya, Flexbox is really nice. I was playing around with that, and studying up on it. I was just concerned about browser support. Seems well supported, but not by everything. I guess I could just shrug off the IE users (and whatever the other browser with iffy support is). I was trying to do it with something that’s been around longer, as it’s not really a complex thing… but I just can’t seem to get it to work. I often struggled wtih positioning… especially vertically. Again, I must be doing something wrong, as nothing seems to be moving the element, regardless of what I try (except for top padding). ---
**Author:** ![ladlon](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/ladlon/32/928_2.png) [@ladlon](https://forum.pinegrow.com/u/ladlon)\ **Post date:** [January 21, 2018, 3:46am UTC](https://forum.pinegrow.com/t/positioning-question/1528/4 "2018-01-21T03:46:03Z")
Just read one of the articles in your link… Looks like it is an issue afterall (fixed by either applying a hack, or just using Flex). Okay, well it seems people are cool with the current level of support (ignoring the IE thing). I’m by no means a high-end user, and my site is hardly a high traffic, global high-end thing, so I’m sure I can live with some incompatibility. Thanks for that. ---
**Author:** ![Pinegrow\_User](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/pinegrow_user/32/4919_2.png) [@Pinegrow\_User](https://forum.pinegrow.com/u/Pinegrow_User)\ **Post date:** [January 21, 2018, 4:05am UTC](https://forum.pinegrow.com/t/positioning-question/1528/5 "2018-01-21T04:05:31Z")
> [@ladlon](#): > > Flexbox is really nice […] I was just concerned about browser support. Seems well supported, but not by everything. > > I was trying to do it with something that’s been around longer, as it’s not really a complex thing Well, if you look through the second link I posted above you will find other alternatives if you desire to not use Flexbox. Again it will require you to research, study, compare and learn. Here it is again. > [@Pinegrow\_User](#): > > Otherwise use another alternative as you see fit: > [center align vertically bootstrap column - Google Search](https://www.google.com/search?q=center+align+vertically+bootstrap+column) * * * But as stated previously … > [@Pinegrow\_User](#): > > Google is a developers friend, very rarely are you the first having the issue, search, then search some more! A Google Search will yield all sorts of useful information **if you actually take the time to search**. 🙄 > **[Centering in CSS: A Complete Guide | CSS-Tricks](https://css-tricks.com/centering-css-complete-guide/)** > > Centering things in CSS is the poster child of CSS complaining. Why does it have to be so hard? They jeer. I think the issue isn't that it's difficult to do, > **[How to Center in CSS](http://howtocenterincss.com/)** > > Centering in CSS is a pain in the ass. This is a code generator > that consolidates them and gives you the code you need for each > situation. Etc., 😉 ---
**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\ **Post date:** [February 10, 2018, 6:07pm UTC](https://forum.pinegrow.com/t/positioning-question/1528/6 "2018-02-10T18:07:25Z")
And here you go @ladlon, with regards “flexbox”, as recommended by @Pinegrow_User, @itsmeleo just released a talk/workshop on YouTube today, [https://www.youtube.com/watch?v=vFth\_rVOda4](https://www.youtube.com/watch?v=vFth_rVOda4) which I think you have to subscribe to, in order to see (he does a live chatroom show, each Saturday, 5pm GMT) based on _FlexBox Froggy_ 🙂 > **[Flexbox Froggy](http://flexboxfroggy.com/)** > > A game for learning CSS flexbox If you’ve not seen that, its quite fun.