Interview Formatting

Interview formatting

by Ken Watanabe

HTML

<div class="interview">
    <ul>
        <li class="name">NS</li>
        <li>Over fifty years, you have worked in sculpture, in drawing, in photographs, by painting over photographs, but you have always remained very loyal to painting. Of course you are known as a painter, but in the contemporary world such loyalty to painting is quite unusual.</li>
    </ul>
    <ul>
        <li class="name">GR</li>
        <li>
            <p>A lot of people änd other mediums more attractive - put a screen in a museum and nobody wants to look at the paintings any more.</p>
            <p>But painting is my profession, because it has always been the thing that interested me most. And now I'm of a certain age, I come from a different tradition and, in any case, I can't do anything else.</p>
            <p>I'm still very sure that painting is one of the most basic human capacities, like dancing and singing, that make sense, that stay with us, as something human.</p>
        </li>
    </ul>
</div>

CSS

.interview ul {
    font-family: helvetica;
    letter-spacing: 0.02em;
    
    margin-left: 0;
    padding-left: 0;
}
.interview ul li {
    color: black;
    display: table-cell;
    list-style: none;
}
.interview ul li:first-child {
    white-space: nowrap;
}
.interview ul li:last-child {
    color: black;
    list-style-position: inside;
    padding-left: 1em;
}
.name {
    font-weight: bold;
    color: #ffffff;
}
p:first-of-type {
    text-indent:0;
}
p {
    text-indent:1em;
    margin: 0;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens:auto;
}