Title: space between boxes Last modified: September 21, 2018 --- # space between boxes * [mindiapolis](https://wordpress.org/support/users/mindiapolis/) * (@mindiapolis) * [7 years, 8 months ago](https://wordpress.org/support/topic/space-between-boxes/) * Hi, why can’t I put any space between the between the boxes? I put `margin-right: 50x;` just for testing purposes on both the infoBox and the .flip3D .Front classes but neither worked. * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fspace-between-boxes%2F%3Foutput_format%3Dmd&locale=en_US) to see the link]_ Viewing 8 replies - 1 through 8 (of 8 total) * Moderator [Steven Stern (sterndata)](https://wordpress.org/support/users/sterndata/) * (@sterndata) * Volunteer Forum Moderator * [7 years, 8 months ago](https://wordpress.org/support/topic/space-between-boxes/#post-10708748) * I recommend asking at [https://wordpress.org/support/theme/alante#new-post](https://wordpress.org/support/theme/alante#new-post) so the theme’s developers and support community can help you with this. * [danthefan](https://wordpress.org/support/users/danthefan/) * (@danthefan) * [7 years, 8 months ago](https://wordpress.org/support/topic/space-between-boxes/#post-10709684) * your `.front` div has an absolute width. change that to a relative one. * [Abhishek](https://wordpress.org/support/users/abhiprep/) * (@abhiprep) * [7 years, 8 months ago](https://wordpress.org/support/topic/space-between-boxes/#post-10710158) * hello, [@mindiapolis](https://wordpress.org/support/users/mindiapolis/) Use this in your additional CSS you will get space between the block. * ``` .front { display: block; margin-left: 56px; position: relative; min-height: 250px; } ``` - This reply was modified 7 years, 8 months ago by [Steven Stern (sterndata)](https://wordpress.org/support/users/sterndata/). * Thread Starter [mindiapolis](https://wordpress.org/support/users/mindiapolis/) * (@mindiapolis) * [7 years, 8 months ago](https://wordpress.org/support/topic/space-between-boxes/#post-10711928) * Neither one of those suggestions helped. * [Abhishek](https://wordpress.org/support/users/abhiprep/) * (@abhiprep) * [7 years, 8 months ago](https://wordpress.org/support/topic/space-between-boxes/#post-10714787) * [@mindiapolis](https://wordpress.org/support/users/mindiapolis/), it works here I just again check it. * I guess you’re doing something wrong while putting the code in style.css use this and remove your code which you’re using right now for same classes. * ``` .flip3D > .front { display: block; margin-left: 56px; position: relative; transform: perspective(600px) rotateY(0deg); background: #79A696; width: calc(100% - 25px); min-height: 250px; border-radius: 7px; backface-visibility: hidden; font-size: 24pt; vertical-align: middle; } ``` * Thread Starter [mindiapolis](https://wordpress.org/support/users/mindiapolis/) * (@mindiapolis) * [7 years, 8 months ago](https://wordpress.org/support/topic/space-between-boxes/#post-10716454) * unfortunately that didn’t help. * Thread Starter [mindiapolis](https://wordpress.org/support/users/mindiapolis/) * (@mindiapolis) * [7 years, 8 months ago](https://wordpress.org/support/topic/space-between-boxes/#post-10716505) * Also, how can I make the boxes the same height when they flip? if you could answer these two questions ASAP that would be great! * Thread Starter [mindiapolis](https://wordpress.org/support/users/mindiapolis/) * (@mindiapolis) * [7 years, 8 months ago](https://wordpress.org/support/topic/space-between-boxes/#post-10719951) * I reworked some of the CSS but still can’t resolve either problem. Also,, how can I get the boxes to be the same height when they flip? Sharla l * ``` #mainText { margin-left:15px; margin-top:5px; } .front { display:block; position:relative; min-height:255px; } .flip3D { width:305px; height:255px; float:left; margin-left:auto; margin-right:auto; margin-bottom:150px } .flip3D > .front { margin-right:5px; position:absolute; transform:perspective(600px) rotateY(0deg); -webkit-transform:perspective(600px) rotateY(0deg); background:#79A696;width:305px; height:22px;/*won't change height.*/ border-radius:7px; backface-visibility:hidden; -webkit-backface-visibility:hidden; transition:transform .5s linear 0s; transition: -webkit-transform .5s linear 0s; font-size:24pt; } .flip3D > .back { margin-right:5px; position:absolute; transform:perspective(600px) rotateY(180deg); -webkit-transform:perspective(600px) rotateY(180deg); background:black; width:305px; height:225px; /*change the box height*/ border-radius:7px; padding:10px; color:#ffffff; backface-visibility:hidden; -webkit-backface-visibility:hidden; transition:transform .5s linear 0s; transition: -webkit-transform .5s linear 0s; } .flip3D:hover > .front{ transform: perspective(600px) rotateY(-180deg); -webkit-transform: perspective(600px) rotateY(-180deg); } .flip3D:hover > .back{ transform: perspective(600px) rotateY(0deg); -webkit-transform: perspective(600px) rotateY(0deg); } #contactUs { clear:left; background-color:#79A696; height:80px; width:210px; margin-top:120px; margin-left:auto;; margin-right:auto; border-radius:50%; text-align:center; color:#ffffff; font-family:'Chivo', sans-serif; font-size:24pt; } #footer-core { text-align:center; } #header-core { display:none; } #sub-footer { display:none; } #footer-core h3.footer-widget-title { display: none; } ``` Viewing 8 replies - 1 through 8 (of 8 total) The topic ‘space between boxes’ is closed to new replies. * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/) * 8 replies * 4 participants * Last reply from: [mindiapolis](https://wordpress.org/support/users/mindiapolis/) * Last activity: [7 years, 8 months ago](https://wordpress.org/support/topic/space-between-boxes/#post-10719951) * Status: not resolved ## Topics ### Topics with no replies ### Non-support topics ### Resolved topics ### Unresolved topics ### All topics