<style>
    #container {
        border: 2px solid black;
        padding: 10px;
    }
    #container div {
        height: 30px;
        border: 1px solid black;
    }
    .title {
        background-color: blueviolet;
    }
    .element {
        background-color: greenyellow;
    }

    [data-id=title-2] {
        margin-left: 20px;
    }

    [data-id=title-3] {
        margin-left: 40px;
    }

    #container [data-id=title-2] ~ .element {
        margin-left: 20px;
    }
    #container [data-id=title-3] ~ .element {
        margin-left: 40px;
    }
</style>

    <div id="container">
        <div class="title" data-id="title-1">Title 1</div>
        <div class="title" data-id="title-2">Title 2</div>
        <div class="element">Element A</div>

        <div class="title" data-id="title-1">Title 1</div>
        <div class="title" data-id="title-2">Title 2</div>
        <div class="title" data-id="title-3">Title 3</div>
        <div class="element">Element B</div>

        <div class="title" data-id="title-1">Title 1</div>
        <div class="title" data-id="title-2">Title 2</div>
        <div class="element">Element C</div>
    </div>