Questions tagged [pure-css]

It is a CSS with a minimal footprint. Pure is ridiculously tiny. The entire set of modules clocks in at 4.0KB* minified and gzipped. Pure builds on Normalize.css and provides layout and styling for native HTML elements, plus the most common UI components.

It is a CSS with a minimal footprint. Pure is ridiculously tiny. The entire set of modules clocks in at 4.0KB* minified and gzipped. Pure builds on Normalize.css and provides layout and styling for native HTML elements, plus the most common UI components. Pure is responsive out of the box, so elements look great on all screen sizes. By using Grids, Menus, and more, it's easy to create beautiful responsive layouts for all screen sizes. Pure has minimal styles and encourages you to write your application styles on top of it.

62 questions
0
votes
1 answer

How can I integrate Pure CSS framework with a tool such as Figma

I would like to use a light CSS framework like Pure CSS, but also combine its use with a user-friendly design tool like Figma. How can I do this with Figma or any other tool?
Sammy
  • 79
  • 1
  • 3
0
votes
1 answer

Modal Window - Pure CSS

When building a modal, I have trouble understanding why the article tag has to be nested within this div tag for opening a modal. If anyone could explain why this would be necessary, and possibly a solution to do without, I would greatly appreciate…
ALW
  • 3
  • 2
0
votes
1 answer

Gap created by scrollbar in CSS parallax scrolling sites

I'm a big fan of Keith Clark's pure CSS parallax technique and have been using it with some success on one of my own sites. Recently, however, I noticed that the background parallax elements, even in his own demo, do not abut the left side of the…
dawaltco
  • 338
  • 1
  • 11
0
votes
1 answer

Pure css default state override

I've been making a tab menu in a website. Pretty simple feature: every tab contains images and they appear only when the right tab is clicked. This is for an online course I'm taking and we're supposed to do this with css only. The problem I'm…
pool matho
  • 39
  • 11
0
votes
1 answer

Pure css parallax effect producing uneven sections

I am trying to produce a very simple website with four sections using the parallax effect. Each section has a background image, a title and a subtitle. Even though all four images are exactly the same height (600px), only a fraction of the third…
Maz
  • 118
  • 10
0
votes
1 answer

Tab navigation bar with arrow below the activated menu

.tab .nav-tabs{ border-bottom: 2px solid #ddd; } .tab .nav-tabs li{ margin: 0 2px 0 0; position: relative; } .tab .nav-tabs li.active:before{ content: ""; position: absolute; bottom:…
0
votes
2 answers

Pure css change Big image on hover over thumbnails

I have this html code:
Teak Cleaner - 1lt bring back the original colour of teak/hardwood - Teak care
0
votes
0 answers

How to center website responsive in pure

I am using the pure framework, which does not seem to provide a mechanism for centering the complete page. I found following snippet: #container { width:100%; max-width:750px; margin: 0 auto; } On the desktop everything works fine: But on the…
user6216224
0
votes
1 answer

CSS Menu With Down Arrow

a:hover,a:focus{ text-decoration: none; outline: none; } .tab .nav-tabs{ border-bottom: 2px solid #ddd; } .tab .nav-tabs li{ margin: 0 2px 0 0; position: relative; } .tab .nav-tabs li.active:before{ content:…
0
votes
3 answers

font effect not applied

@font-face { font-family: 'sakal_marathinormal'; src: url('sakal_marathi_normal-webfont.woff2') format('woff2'), url('sakal_marathi_normal-webfont.woff') format('woff'), url('Sakal_Marathi_Normal.ttf')…
0
votes
1 answer

Why does adding this component break lots of stuff? (lots of stuff will be defined below)

I have the 3 components shown below: news-feed.component user-activity-item.component user-activity-list.component Both user-activity components are in a sub directory of news-feed component. Also, the user-activity item, is just a member of the…
trueCamelType
  • 2,198
  • 5
  • 39
  • 76
0
votes
2 answers

PureCss Responsive Images

I am just trying to do my first page using purecss, what I am stuck at the moment is in using pure-img for having responsive images, the image are responsive when I reduce the screen but when the screen become bigger and the image are supposed to…
Albic7
  • 11
  • 2
0
votes
3 answers

:hover style on div with an image that doesnt trigger

I've been trying to make a overlay hover effect on a website with pure css

Mads I
  • 163
  • 2
  • 10
0
votes
1 answer

Label text messed up with Pure CSS select

PLNKR example of problem The label reads Group By, but the letters are all superimposed for some reason. Here is the HTML: Label font
Nishant Roy
  • 1,043
  • 4
  • 16
  • 35
-1
votes
1 answer

Centered Menu Dropdowns in Purecss Framework

This is my current menu copied from Purecss documentation which works fine:
Ehsan
  • 1,022
  • 11
  • 20