I want the text and the buttons to be in a single row, but its not happening..how can i do that? i'm creating my first portfolio

1 
  <div class="col-lg-6">
    <h1>jamil</h1>
  </div>

  <div class="col-lg-6">
    <a href="#"><button class="btn btn-block">About</button></a>
    <a href="#"><button class="btn btn-block ">Portfolio</button></a>
    <a href="#"> <button class="btn btn-block">Contact</button></a>
  </div>
2

Works for me with Bootstrap 3, so maybe this is the issue:

3

I think you should enclose it with a div with a “row” class.

4

thanks johan…
i have a div with row. i just missed it while posting, didn’t check the preview. anyway here it is

Screenshot from 2017-05-03 22-59-40.png1366Ă—768 151 KB

5

Do you also get this behaviour when the preview is full screen? Since you use .col-lg-6 it will default to full width on md, sm and xs.

6

i was talking about preview of question posting.

7

and yeah…i get this behaviour when the preview is full screen…this is about the project

8

If you remove the “btn-block” class, all three buttons will be on a single row. That’s what you want?

9

You forgot to add Bootstrap CSS in your pen.

10

actually i want them to be on same row, text “jamil” on left and “about, portfolio” etc on right side of same row
for example in the below picure freecodecamp is on left side and those map,chat etc are on right side of same row

image.jpg1366Ă—768 209 KB

11

how to add that css?

12

Settings > CSS > quick add: Bootstrap

And if you want to use Bootstrap 3 (the version fCC uses) you need to change 4.0.0-alpha.6 to 3.3.7.

13

thank you so much ben…it’s working::laughing:

1 Like