forked from PrivateCoffee/wikimore
fix(css): replace width with max-width for better layout
Switched multiple instances of `width: 100%` to `max-width: 100%` in the CSS. This adjustment prevents elements from stretching beyond their container's bounds, improving the overall responsiveness and visual presentation of the layout. Helps ensure better alignment and avoids potential overflow issues on smaller screens.
This commit is contained in:
parent
98a5349ac2
commit
b5744d1e0d
1 changed files with 10 additions and 11 deletions
|
@ -94,7 +94,7 @@ h1 {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
width: 100%;
|
max-width: 100%;
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -128,7 +128,6 @@ h1 {
|
||||||
margin: 1em auto;
|
margin: 1em auto;
|
||||||
font-size: small;
|
font-size: small;
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
width: 100%;
|
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
background-color: #f9f9f9;
|
background-color: #f9f9f9;
|
||||||
border: 1px solid #ddd;
|
border: 1px solid #ddd;
|
||||||
|
@ -298,7 +297,7 @@ h1 {
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
font-size: small;
|
font-size: small;
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
width: 100%;
|
max-width: 100%;
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
@ -385,7 +384,7 @@ figure,
|
||||||
background-color: #f9f9f9;
|
background-color: #f9f9f9;
|
||||||
border: 1px solid #ddd;
|
border: 1px solid #ddd;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 100%;
|
max-width: 100%;
|
||||||
display: block;
|
display: block;
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
|
@ -464,25 +463,25 @@ span {
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
width: 100%;
|
max-width: 100%;
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
float: none;
|
float: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.table {
|
.table {
|
||||||
width: 100%;
|
max-width: 100%;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.infobox {
|
.infobox {
|
||||||
width: 100%;
|
max-width: 100%;
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
float: none;
|
float: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
figure,
|
figure,
|
||||||
.tmulti {
|
.tmulti {
|
||||||
width: 100%;
|
max-width: 100%;
|
||||||
display: block;
|
display: block;
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
}
|
}
|
||||||
|
@ -513,7 +512,7 @@ span {
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
width: 100%;
|
max-width: 100%;
|
||||||
margin: 5px 0;
|
margin: 5px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -523,13 +522,13 @@ span {
|
||||||
}
|
}
|
||||||
|
|
||||||
.infobox {
|
.infobox {
|
||||||
width: 100%;
|
max-width: 100%;
|
||||||
margin: 5px 0;
|
margin: 5px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
figure,
|
figure,
|
||||||
.tmulti {
|
.tmulti {
|
||||||
width: 100%;
|
max-width: 100%;
|
||||||
margin: 5px 0;
|
margin: 5px 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue