How do I make these buttons align side by side? I have this so far

HTML-CSS
1 
/* RETAKE QUIZ BUTTON */
.quiz-container .next-btn, 
.quiz-result .retake-btn { 
    background: #222;
    color: white;
    border: none;
    padding: 12px 32px;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 3px;
    cursor: pointer;
    width: fit-content; /*o botão RETAKE QUIZ contido */
}

/* FINISH QUIZ BUTTON */
.quiz-result .finishQuiz-Btn {
    
    background: #222;
    color: white;
    border: none;
    padding: 12px 32px;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 3px;
    cursor: pointer;
    width: fit-content; 
    margin-left: auto; /* moves button to the right */
}

Captura de tela 2024-09-11 100946
Captura de tela 2024-09-11 1009461019×883 35.4 KB

2

If you can put your code in a codepen.io then it will make it easier for some of us to play with the code and answer you.

3

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

And you have to show your full HTML and CSS in order to get help, you can just follow the friendly advice above

6

Can anyone help me with this, please? Thank you.

7

Hello @rtiozzo !

I am not sure if this will work. But maybe try creating a .retake-btn, .finishQuiz-Btn and set the display to inline.

Not sure this is what you are looking for.

As stated in a previous post, it is difficult to help all code.

Wishing you good progress! :slightly_smiling_face: