# Bootstrap layout help **URL:** \ **Category:** General\ **Created:** [August 2, 2017, 5:19pm UTC](https://forum.freecodecamp.org/t/bootstrap-layout-help/139671 "2017-08-02T17:19:34Z")\ **Posts on this page:** 8\ **Page:** 1
**Author:** ![inder23](https://avatars.discourse-cdn.com/v4/letter/i/e9bcb4/32.png) [@inder23](https://forum.freecodecamp.org/u/inder23)\ **Post date:** [August 2, 2017, 5:19pm UTC](https://forum.freecodecamp.org/t/bootstrap-layout-help/139671/1 "2017-08-02T17:19:35Z")
I am having some problems with the following [pen](https://codepen.io/inder12/pen/WExoVd?editors=1000). I am uing two “row” classes but having the following problems setting up my layout for the calculator challenge: 1. The first row should take the text area across the entire length of the screen but it is only covering part of it. By using col-xs-12 in the class I thought it would do this, 2. I am trying to get the four buttons all next to each other(underneath the text-area), but they are stacking. My understanding was that by using the four “col-xs-3” within the “row” class it should have put them next to each other. Any help would be great. ---
**Author:** ![sypher85](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/sypher85/32/61632_2.png) [@sypher85](https://forum.freecodecamp.org/u/sypher85)\ **Post date:** [August 2, 2017, 6:36pm UTC](https://forum.freecodecamp.org/t/bootstrap-layout-help/139671/2 "2017-08-02T18:36:49Z")
I cant help much, but if i had a guess it would be something todo with a block level html tag and you want the buttons to inline. some css to change it to inline-block. search mdn inline-block. I hope this makes sense to you. ---
**Author:** ![inder23](https://avatars.discourse-cdn.com/v4/letter/i/e9bcb4/32.png) [@inder23](https://forum.freecodecamp.org/u/inder23)\ **Post date:** [August 2, 2017, 6:39pm UTC](https://forum.freecodecamp.org/t/bootstrap-layout-help/139671/3 "2017-08-02T18:39:17Z")
> [@sypher85](#): > > some css to change it to inline-block. > > search mdn inline-block. > > I hope this makes sense to you. Thanks, I will have a look into this ---
**Author:** ![sypher85](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/sypher85/32/61632_2.png) [@sypher85](https://forum.freecodecamp.org/u/sypher85)\ **Post date:** [August 2, 2017, 6:43pm UTC](https://forum.freecodecamp.org/t/bootstrap-layout-help/139671/4 "2017-08-02T18:43:08Z")
i have added bootstrap v3 to the head of the html and added a class of button the get the buttons to be inline-block here is a link. [pen](https://codepen.io/Garethd85/pen/jLMrrZ/) ---
**Author:** ![inder23](https://avatars.discourse-cdn.com/v4/letter/i/e9bcb4/32.png) [@inder23](https://forum.freecodecamp.org/u/inder23)\ **Post date:** [August 2, 2017, 7:51pm UTC](https://forum.freecodecamp.org/t/bootstrap-layout-help/139671/5 "2017-08-02T19:51:47Z")
Thanks @sypher85 for the example. By looking at your code I realised the mistake I had made. I had not added bootstrap to my css tab settings in codepen. I had acciedntally added bootstrap to my javascript tab settings. I added bootstrap and the layout is now working. Thanks again for your help ---
**Author:** ![sypher85](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/sypher85/32/61632_2.png) [@sypher85](https://forum.freecodecamp.org/u/sypher85)\ **Post date:** [August 2, 2017, 8:13pm UTC](https://forum.freecodecamp.org/t/bootstrap-layout-help/139671/6 "2017-08-02T20:13:38Z")
thats ok, im glad I could help in some way. ---
**Author:** ![DaveC](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/davec/32/161518_2.png) [@DaveC](https://forum.freecodecamp.org/u/DaveC)\ **Post date:** [August 3, 2017, 1:55am UTC](https://forum.freecodecamp.org/t/bootstrap-layout-help/139671/7 "2017-08-03T01:55:01Z")
Both issues are caused by the same thing: you’re missing bootstrap in your CSS settings. You have it in the JS settings, but now in the CSS settings. As soon as I added it, everything snapped into place. EDIT: Doh! Somehow, I didn’t see the lower replies… didn’t read far enough. 😛 Glad you sorted it. ---
**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\ **Post date:** [January 17, 2021, 8:46pm UTC](https://forum.freecodecamp.org/t/bootstrap-layout-help/139671/8 "2021-01-17T20:46:23Z")
Closed on January 17, 2021, 8:46pm UTC