Skip to content

Commit 8113276

Browse files
authored
Add CSS examples and rename subtitle
1 parent 6eb8d34 commit 8113276

File tree

1 file changed

+38
-4
lines changed

1 file changed

+38
-4
lines changed

README.md

Lines changed: 38 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Jacob Krol: Resume and Information Page
1+
# Jacob Krol: The Web Development Journey
22

33
Welcome to my GitHub! This is the host repository of my main webpage, [jacobkrol.github.io](https://jacobkrol.github.io/). This isn't my profile, but I'd like to share how my webpage got to be what it is today.
44

@@ -58,8 +58,6 @@ With basic HTML, CSS, and JavaScript, I was able to create my very first resume
5858

5959
![Screenshot unable to load](https://raw.githubusercontent.com/jacobkrol/jacobkrol.github.io/master/non-webpage/first-design.png)
6060

61-
### First Redesign
62-
6361
While revising my code, my skills improved, and I was able to better and better notice glaring mistakes like missing cross-browser compatibility, mobile-support, and misalignment galore.
6462

6563
<details><summary>Expand if you dare</summary>
@@ -78,7 +76,43 @@ While revising my code, my skills improved, and I was able to better and better
7876
```
7977
</details>
8078

81-
This inspired me to start all over again. I created blank files and got to work on a more modern, responsive, and responsible design. I may very well redesign my webpage more times, but this was a crucial step in the process of understanding that sometimes coding with an older version of yourself is slower than coding all alone with your new skillset.
79+
### First Redesign
80+
81+
The problems in the first design inspired me to start all over again. I created blank files and got to work on a more modern, responsive, and responsible design. I may very well redesign my webpage more times, but this was a crucial step in the process of understanding that sometimes coding with an older version of yourself is slower than coding all alone with your new skillset.
82+
83+
<details><summary>Not to brag but...</summary>
84+
85+
My CSS improved a bit.
86+
```css
87+
.skill-box:not(.skill-text) > *:nth-child(2) {
88+
margin-left: 20px;
89+
}
90+
```
91+
</details>
92+
93+
And after I read that older version of Internet Explorer would struggle with `display: table` I learned `flex-box` inside-out and even learned the importance of pre-fixes.
94+
95+
<details><summary>Example from my stylesheet</summary>
96+
97+
```css
98+
.vert-align {
99+
display: -webkit-box;
100+
display: -ms-flexbox;
101+
display: flex;
102+
103+
-webkit-box-orient: horizontal;
104+
-webkit-box-direction: normal;
105+
-ms-flex-direction: row;
106+
flex-direction: row;
107+
108+
-webkit-box-align: center;
109+
-ms-flex-align: center;
110+
align-items: center;
111+
}
112+
```
113+
</details>
114+
115+
\* All of this said, I have improved, but have a long way to go. If there are still coding conventions broken here, or better ways to handle my webpage's code, please contact me at [email protected] so I can learn and modify appropriately.
82116

83117
### The Big Realization
84118

0 commit comments

Comments
 (0)