Remember "set and forget"? Were you creating a piece of code or set up a key process, it works so you don’t use it again. Until you do! then the “forget” problem occurs and, you go and research the problem all over again. Well, we had that problem so we have set up these pages to help remember that piece of code we used last year but can’t remember.
.shrink {
width: 100%;
height: auto;
}
Notes : You can of course change the class name to suit your needs.
Our responsive image. We combined the two classes. Shrink the browser to see the result.
<p class="shrink boarder" img src="photo"></p>
.boarder
{
border: 3px solid red;
border-radius: 20px;
}
Notes : This code sets a 3 pixel line coloured red with each corner rounded by 20 pixels.
<p class="boarder">Here is a Parragraph.</p>
The example.
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
</body>
</html>