Questions tagged [yui-pure-css]

Pure is a set of reusable CSS modules created by the YUI team.

The Pure.css framework is an advanced responsive, mobile-first, HTML5, base-theme developed at Yahoo.


Documentation :

112 questions
2
votes
1 answer

purecss.io - Why are two pure-u-1-2 elements stacking on a wide screen?

Banging my head against this all morning (trying almost every possible combination), I still cannot figure this out. Why are the two pure-u-1-2 elements stacking over one another? Tested on Chrome on a desktop (verified using other browsers) and the…
Bill
  • 2,319
  • 9
  • 29
  • 36
2
votes
1 answer

CSS width wierdness in Chrome and Firefox with Pure CSS

To start off with, I'm quite new to CSS still so I hope I haven't done anything horrendously stupid. Basically, I have a design I'm doing built using Pure and the width is playing up in Google Chrome, while it works as intended in Firefox. Here's a…
user478250
  • 259
  • 2
  • 9
1
vote
5 answers

How to center the content of (centered) pure css columns

The snippet presents a series of columns containing a single letter. I'd like to have the center of the glyph in the center of each, but as you can see, they not quite centered -- appearing just off to the right. (I suspect by half the glyph width,…
goodson
  • 727
  • 2
  • 14
  • 24
1
vote
0 answers

Hide and show table inside table when check box is checked in pure css

I want to send mail with the below template from code. I am trying to hide and display the secondary table with the checkbox. I think I am stuck with the css selector. Is it possible to hide and show something with the checkbox. Important thing is I…
1
vote
1 answer

How to stop the text under Images of Pure Grid Div from getting Squashed

I'm using the CSS pure grid class to make a grid of images and placing a text label below each one. However, this is not working out because the text is getting squashed (see the image below): Here is my code:
mayankmehtani
  • 435
  • 4
  • 14
1
vote
1 answer

How to add inline CSS styles to an element for which the source of the CSS is a file (and not inline text) that you can't feasibly edit?

I have an html page (index.html) and css page (styles.css) with various elements (including a table) and styles: index.html: ...
1
vote
1 answer

Responsive Menu with Dropdown Elements

Mostly I'm copying the demo code from the PureCSS "docs" for implementing their dropdown menu. I have created a CodePen, and will share code here as well. The problem is that in the vertical version, the submenu items are not being revealed on hover…
MikeiLL
  • 6,282
  • 5
  • 37
  • 68
1
vote
0 answers

Flexbox grandchildren not expanding children height

In this example, the grandchild has a height of 150% of the parent height. This means that it's 50% longer than the parent. 25% of the grandchildren gets "clipped" as a result. If I do not use a relative height it does work as intended. .children…
MinusFour
  • 13,913
  • 3
  • 30
  • 39
1
vote
2 answers

Background-image in

The background-image within the video id (#video) isn't displaying. I've included the pure gridstyles. I've tried alternate ways of using tags, however later on i'd also like to add in a button in the middle of the image. Is there a way of using…
B.Liu
  • 187
  • 1
  • 12
1
vote
1 answer

Pure CSS grid sixths

Using Pure CSS from Yahoo. With the below code block, the first two div grids render as expected. Children of the first div are all 1/6th and the children of second are 1/6th and 5/6th. However, with the third one, the 1/6th renders fine but the…
reggaemahn
  • 6,272
  • 6
  • 34
  • 59
1
vote
1 answer

Box offset when using the pure css framework

I'm using pure css for my website. The problem is, that the boxes have a weird offset, that is definied nowhere The boxes don't move even when I set padding and margin to zero. This causes the last box to move in the second row. HTML:
Bitte Wenden
  • 100
  • 10
1
vote
1 answer

How can I apply a UI framework explicitly rather than globally?

I want to use a UI framework for the admin backend in a Wordpress plugin. Unfortunately, most frameworks apply many styles globally rather than explicitly. These global resets and overrides work well for sites built from the ground up, but they can…
1
vote
1 answer

Add PureCSS to MVC 4.5 bundle

I'm currently learning ASP.NET 4.5 of the MVC flavour, and I've decided to remove bootstrap completely and go with PureCSS (http://www.purecss.io). This is largely due to the fact that my web application requires almost no scripting other than on…
Connor Spangler
  • 805
  • 2
  • 12
  • 29
1
vote
1 answer

Sticky footer with purecss

I want to achieve a sticky footer so the footer is at the bottom of the window even if the page content is short, but will be pushed down on pages with longer content (like this). I am using YUI purecss on the page, but the pure-g div in the header…
stickyuser
  • 2,552
  • 15
  • 15
1
vote
2 answers

PureCSS.io menu & Leaflet page height

I'm trying to create a fullscreen map with leaflet and a purecss horizontal menu on top of it. Here is a solution for making the map height 100% (set parent elements also to 100% height). So right now, I've got something like this: