forked from robert/robertjohnson.work
Prevent overflow into dates (#245)
Previously "MAI in Mechanical Engineering" would overflow into "2014 - 2019" at certain resolutions (iPads) as the 'time' <div> is not separated from <h3> or 'degree'. Now they are in separate containers using the 'flex' css attribute to in the parent <div> and in both elements to keep them in two columns
This commit is contained in:
parent
78bb1e6580
commit
0d8fce9100
@ -186,6 +186,7 @@ p {
|
|||||||
position: relative;
|
position: relative;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin-bottom: 2px;
|
margin-bottom: 2px;
|
||||||
|
display: flex;
|
||||||
}
|
}
|
||||||
.job-title,
|
.job-title,
|
||||||
.degree {
|
.degree {
|
||||||
@ -194,12 +195,14 @@ p {
|
|||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
|
flex: 75%;
|
||||||
}
|
}
|
||||||
.time {
|
.time {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 0;
|
right: 0;
|
||||||
top: 0;
|
top: 0;
|
||||||
color: $text-grey;
|
color: $text-grey;
|
||||||
|
flex: 25%;
|
||||||
}
|
}
|
||||||
.company,
|
.company,
|
||||||
.university {
|
.university {
|
||||||
|
Loading…
Reference in New Issue
Block a user