Re: Could use some CSS help please ....
Posté: Mer Nov 15, 2017 10:08 am
Hi,
Here's for your links. Just overide the default CSS behaviour of underlying links with text-decoration:none and put a padding to add some space (you can remove it as you like).
For the bullets, ul represent the list while li is the bullets itselves. To add space under each bullet, you must style li.
For the headers, you have some inherit from *, html, body in your code. Normaly, no words are ever capitalized. With CSS, captitalized the first letter of each word in a sentence is impossible, only by some Javascript or the CSS code under. I put just for the show, do not use this in production please. ::first-letter only works on a block element, so have to force span to display as a (inline-)block.
CSS time
HTML time
Enjoy
Here's for your links. Just overide the default CSS behaviour of underlying links with text-decoration:none and put a padding to add some space (you can remove it as you like).
- Code: Tout sélectionner
a:link {
border-bottom: 1px dotted #955251;
text-decoration:none;
padding-bottom:5px;
}
For the bullets, ul represent the list while li is the bullets itselves. To add space under each bullet, you must style li.
- Code: Tout sélectionner
ul, ol{margin-left:2.0em;padding-left:10px;}
li{margin-bottom:15px;}
For the headers, you have some inherit from *, html, body in your code. Normaly, no words are ever capitalized. With CSS, captitalized the first letter of each word in a sentence is impossible, only by some Javascript or the CSS code under. I put just for the show, do not use this in production please. ::first-letter only works on a block element, so have to force span to display as a (inline-)block.
CSS time
- Code: Tout sélectionner
h1 span{display:inline-block;}
h1 span::first-letter{text-transform:uppercase;}
HTML time
- Code: Tout sélectionner
<h1>Title <span>header</span> 1 <span>in</span></h1>
Enjoy