beenull/mini.css
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Made images responsive by default, added to base

Browse source
This commit is contained in:
Angelos Chalaris 2016-08-24 14:59:21 +03:00
parent cef1ce30cf
commit 473cbac5e2
5 changed files with 19 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
README.md
View file

@ -3,7 +3,7 @@ A minimal, responsive CSS framework to get you started.
## Components
- **base**: normalize.css & basic typography `GZIPPED SIZE`: 1,186 bytes
- **base**: normalize.css & basic typography `GZIPPED SIZE`: 1,195 bytes
- **button**: button styles `GZIPPED SIZE`: 427 bytes
- **form**: form styles `GZIPPED SIZE`: 517 bytes
- **grid**: default 12-column grid `GZIPPED SIZE`: 447 bytes

10
css/mini-full.css
View file

@ -16,8 +16,9 @@ body {
/*
Correct display in IE 9-.
Give images display: block to be responsive.
*/
article, aside, footer, header, nav, section, figcaption, figure, main, details, menu {
article, aside, footer, header, nav, section, figcaption, figure, main, details, menu, img {
display: block; }
/*
@ -206,9 +207,11 @@ sup {
/*
Remove the border on images inside links in IE 10-.
Make images responsive.
*/
img {
border-style: none; }
border-style: none;
max-width: 100%; }
/*
Hide the overflow in IE.
@ -284,8 +287,9 @@ textarea {
/*
Correct the cursor style of increment and decrement buttons in Chrome.
Make images responsive.
*/
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button, img {
height: auto; }
/*

2
css/mini-full.min.css vendored
View file

File diff suppressed because one or more lines are too long

8
scss/mini/_base.scss
View file

@ -16,8 +16,9 @@ body {
}
/*
Correct display in IE 9-.
Give images display: block to be responsive.
*/
article, aside, footer, header, nav, section, figcaption, figure, main, details, menu {
article, aside, footer, header, nav, section, figcaption, figure, main, details, menu, img {
display: block;
}
/*
@ -201,9 +202,11 @@ sup {
}
/*
Remove the border on images inside links in IE 10-.
Make images responsive.
*/
img {
border-style: none;
max-width: 100%;
}
/*
Hide the overflow in IE.
@ -281,8 +284,9 @@ textarea {
}
/*
Correct the cursor style of increment and decrement buttons in Chrome.
Make images responsive.
*/
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button, img {
height: auto;
}
/*

5
testpage.html
View file

@ -129,7 +129,10 @@ Suspendisse varius turpis et dui viverra semper.</pre>
</div>
</fieldset>
</form>
<h3>Notes for the demo page</h3>
<ul>
<li>Responsive images are part of the _base.</li>
</ul>
</body>
</html>