How to indent a heading under a numbered list in Rmarkdown knitting to HTML?

Question

I have this Rmarkdown file:

---
title: "Indent heading under list"
output: html_document
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE)
```

## This is a heading

1. I have some numbered list items under this heading

2. And I want to have sub-heading under this numbered listed

3. Under this new sub-heading, I want to have tabs under it

### Sub-heading I want {.tabset .tabset-fade .tabset-pills}

#### Apple

- This is an apple

#### Orange

- This is an orange

###

4. I want the above sub-heading to have indentation so that it is indented under item number 3 above

Which is currently like this:

As explained in the Rmarkdown itself, I want to have indentation of the sub-heading under the numbered list, so that it will look like this:

Most resources I found online recommend manually indenting the heading(s) with four spaces under the numbered list, but that doesn't work (see attached screenshot).

Answer 1

If you add an indented hyphen before the ### then this creates an indented sub-header. But then there's a bullet, I don't know how to get rid of this one (Edit: now I know; see at bottom).

---
title: "Indent heading under list"
output: html_document
---


## This is a heading

1. I have some numbered list items under this heading

2. And I want to have sub-heading under this numbered listed

3. Under this new sub-heading, I want to have tabs under it

  - ### Sub-heading I want 

    - And I also want an apple

---

EDIT

Here is a CSS way to remove the bullet.

First, assign a HTML class, say nobullet to the subheader:

3. Under this new sub-heading, I want to have tabs under it

  - ### Sub-heading I want {.nobullet}

    - And I also want an apple

Now, add this CSS somewhere, e.g. at the beginning of the document:

<style>
li:has(.nobullet) {list-style-type: none;}
</style>

---

2nd EDIT

Here is a simpler solution, and this one works with the tabs.

---
title: "Indent heading under list"
output: html_document
---

<style>
.indented {padding-left: 100px;}
</style>

## This is a heading

1. I have some numbered list items under this heading

2. And I want to have sub-heading under this numbered listed

3. Under this new sub-heading, I want to have tabs under it

### Sub-heading I want {.indented .tabset .tabset-fade .tabset-pills}

#### Apple 

  - And I also want an apple

#### Orange

  - This is an orange


### 

4. I want the above sub-heading to have indentation so that it is indented under item number 3 above