Elkana
Gebruiker
- Lid geworden
- 12 sep 2008
- Berichten
- 170
Op de volgende pagina https://www.woordschilder.nl/testwoord/ staat een voorbeeldbericht. Deze is beveiligd met het wachtwoord: 'woordschilder'.
De CSS heb ik gekopieerd van https://www.woordenboeken.nu/betekenis?q=woord&dict=nl
Als ik nu de definitie tekst kopieer van deze website, dit er hetzelfde uit komt te zien als op Woordschilder.nl
Uiteraard wil ik deze css graag aanpassen naar mijn eigen stijl en geen complete kopie maken.
I kies voor deze werkwijze om te starten met dezelfde css elementen zodat ik deze later makkelijk aanpassen naar mijn eigen stijl.
Nu loop ik aan tegen het feit dat de ordered lists op mijn website niet op één lijn staan.
De voorbeeldzinnen bijvoorbeeld: staan allemaal onder elkaar met extra enters.
Ik kan er nog niet achter komen hoe ik dit nu voor elkaar krijg.
De CSS heb ik gekopieerd van https://www.woordenboeken.nu/betekenis?q=woord&dict=nl
Als ik nu de definitie tekst kopieer van deze website, dit er hetzelfde uit komt te zien als op Woordschilder.nl
Uiteraard wil ik deze css graag aanpassen naar mijn eigen stijl en geen complete kopie maken.
I kies voor deze werkwijze om te starten met dezelfde css elementen zodat ik deze later makkelijk aanpassen naar mijn eigen stijl.
Nu loop ik aan tegen het feit dat de ordered lists op mijn website niet op één lijn staan.
De voorbeeldzinnen bijvoorbeeld: staan allemaal onder elkaar met extra enters.
Ik kan er nog niet achter komen hoe ik dit nu voor elkaar krijg.
Code:
/*-----------------DEFINITIES CSS VAN www.woordenboeken.nu----------------*/
h2.section-title {
border-bottom: 1px solid red;
border-top: 2px solid blue;
font-size: 1.5em;
display: block;
padding: 10px 0;
margin-bottom: 10px;
width: 100%;
font-weight:normal;
}
.pos-title {
margin-bottom: 0;
color: #555;
font-size: 18px;
font-weight: normal;
}
.title-desc {
font-size: 16px;
color: #555;
}
ol.no-indent {
padding-left: 20px;
}
ol.res-list {
list-style-type: disc /*none*/;
margin: 0;
padding: 0 0 20px 0;
counter-reset: li-counter;
color: green;
}
.lemma-block {
padding-bottom: 5px;
}
.lemma {
font-size: 18px; font-weight: 600;
}
.def-block {
padding-bottom: 5px;
}
.example {
color: #808080;
padding-left: 20px;
font-style: italic;
padding-bottom: 15px;
}
ol.res-list > li {
padding: 10px 0 10px 0;
/*width: 100%;*/
position: relative;
min-height: 3em;
}
.list-item-content {
float: left;
font-size: 15px;
width: 100%;
line-height: 26px;
}
ol.res-list.bordered {
li {
padding: 15px 0 20px 0;
border-bottom: 1px solid black;
}
}
ol.res-list.numbered {
li:before {
position: absolute;
margin-top: 3px;
width: 20px;
font-size: 16px;
font-weight: bold;
color: #555;
content: counter(li-counter)'.';
counter-increment: li-counter;
}
}
.list-item-content {
padding-left: 30px;
}
}
ul.plain-list {
list-style-type: square /*none*/;
}
ul.no-indent {
padding-left: 0;
}
