filifa/dairydemon.net
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

redo css

Browse Source
This commit is contained in:
filifa
2025-12-29 18:40:15 -05:00
parent 55e889b71d
commit d32c065d30
3 changed files with 9 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@@ -11,7 +11,7 @@
<body>
<header>
<div id="headerimg"></div>
<img id="headerimg" src="/images/watching.jpg" alt="cows with red eyes" width="128" height="128" />
<div id="headermain">
<a id="homelink" href="/">dairydemon.net</a>
<p id="tagline">located several wrong turns off the Information Superhighway</p>

37
styles/default.css
View File

@@ -6,19 +6,15 @@ html {
min-height: 100%;
}
header,
footer,
article,
main nav {
border: 3px black solid;
body {
background: turquoise;
margin: 5px;
box-shadow: 2px 2px 2px;
max-width: 80ch;
margin: 0 auto;
}
/* header and footer */
header {
text-align: center;
padding: 1rem;
}
#homelink {
@@ -68,30 +64,7 @@ ol ol ol {
}
@media screen and (min-width: 80ch) {
/* to avoid zoom issues, grid layout is only used when mid-width is
* large enough */
body {
display: grid;
justify-content: center;
}
main {
/* min-width is set due to zoom issues */
min-width: 100%;
display: flex;
align-items: start;
}
main nav {
flex: auto;
position: sticky;
top: 10px;
}
article {
/* width is set for the about page */
width: 80ch;
max-width: 80ch;
flex: auto;
border: 3px black solid;
}
}

13
styles/index.css
View File

@@ -1,8 +1,6 @@
/* header and footer */
header {
display: flex;
align-items: center;
flex-flow: wrap;
padding: 0;
}
footer {
@@ -10,16 +8,11 @@ footer {
}
#headerimg {
border-right: 3px solid black;
width: 128px;
background-image: url("/images/watching.jpg");
flex: initial;
align-self: stretch;
float: right;
}
#headermain {
text-align: center;
flex: auto;
padding: 1rem;
}
#headermain a {