# \#css **URL:** https://forum.pinegrow.com/tag/css/8.md [Latest](https://forum.pinegrow.com/latest.md) · [Categories](https://forum.pinegrow.com/categories.md) · [Tags](https://forum.pinegrow.com/tags.md) --- ## [\[Bug\] SCSS no longer compiles after 9.1 update](https://forum.pinegrow.com/t/bug-scss-no-longer-compiles-after-9-1-update/11542)
**Author:** [@jyn](https://forum.pinegrow.com/u/jyn)\ **Replies:** 8\ **Last updated:** [June 11, 2026, 11:02am UTC](https://forum.pinegrow.com/t/bug-scss-no-longer-compiles-after-9-1-update/11542 "2026-06-11T11:02:20Z")
Hi Pinegrow team, Since the 9.1 update, SCSS compilation is completely broken for me. All my projects using this feature are affected. Setup Template: Plain HTML Workflow: I convert the default style.css to .scss via… --- ## [Hardware-Pixel instead of CSS-Pixel](https://forum.pinegrow.com/t/hardware-pixel-instead-of-css-pixel/11770)
**Author:** [@Stephan](https://forum.pinegrow.com/u/Stephan)\ **Replies:** 7\ **Last updated:** [June 10, 2026, 8:09am UTC](https://forum.pinegrow.com/t/hardware-pixel-instead-of-css-pixel/11770 "2026-06-10T08:09:00Z")
I’ve finished designing and coding a PG Tailwind site. It turns out, however, that on Google’s Pixel 9 XL, the browser uses actual pixels rather than CSS pixels, which makes everything appear far too small. Correcting th… --- ## [@import files no longer live-reload in Page View](https://forum.pinegrow.com/t/import-files-no-longer-live-reload-in-page-view/11541)
**Author:** [@jyn](https://forum.pinegrow.com/u/jyn)\ **Replies:** 1\ **Last updated:** [April 20, 2026, 9:39am UTC](https://forum.pinegrow.com/t/import-files-no-longer-live-reload-in-page-view/11541 "2026-04-20T09:39:03Z")
Hi Pinegrow team, I noticed a regression introduced in the latest update. Here’s my setup: One stylesheet linked to the page: style.css style.css imports a second file via @import: tokens.css Bug — @import files no l… --- ## [Resolution Independent Design](https://forum.pinegrow.com/t/resolution-independent-design/11133)
**Author:** [@bwheaton](https://forum.pinegrow.com/u/bwheaton)\ **Replies:** 7\ **Last updated:** [October 8, 2025, 3:26am UTC](https://forum.pinegrow.com/t/resolution-independent-design/11133 "2025-10-08T03:26:04Z")
I have to create some elements to live on a very large screen (8K). I can’t design on that size but I want everything to scale up proportionally - fonts, gaps, everything. I could work at 1920 wide if I could then scale … --- ## [Uploaded site does not match live edit view or page preview](https://forum.pinegrow.com/t/uploaded-site-does-not-match-live-edit-view-or-page-preview/10368)
**Author:** [@TLCBoudoir](https://forum.pinegrow.com/u/TLCBoudoir)\ **Replies:** 6\ **Last updated:** [February 23, 2025, 8:36pm UTC](https://forum.pinegrow.com/t/uploaded-site-does-not-match-live-edit-view-or-page-preview/10368 "2025-02-23T20:36:15Z")
Using tailwind to further develop my site. I have a simple site up, and want to improve it by using grids and flex to get larger screens to put text and photos side-by-side. The code I’ve written in pinegrow works great … --- ## [How to replace an unsplash background in a template?](https://forum.pinegrow.com/t/how-to-replace-an-unsplash-background-in-a-template/10376)
**Author:** [@apples](https://forum.pinegrow.com/u/apples)\ **Replies:** 4\ **Last updated:** [February 21, 2025, 6:09am UTC](https://forum.pinegrow.com/t/how-to-replace-an-unsplash-background-in-a-template/10376 "2025-02-21T06:09:39Z")
I’d like to edit the image, and downloaded it, but seems unable to replace the following with what I thought would work. I consider that my simplistic attempts won’t mesh with the Bootstrap framework? How can I replace … --- ## [TailwindCSS v4 Support ? \> Answered](https://forum.pinegrow.com/t/tailwindcss-v4-support-answered/10351)
**Author:** [@typescriptkang](https://forum.pinegrow.com/u/typescriptkang)\ **Replies:** 1\ **Last updated:** [February 13, 2025, 5:10pm UTC](https://forum.pinegrow.com/t/tailwindcss-v4-support-answered/10351 "2025-02-13T17:10:18Z")
I don’t understand how such an expensive paid product doesn’t support Tailwind v4. Tailwind CSS v4.0 was first introduced in an alpha release on June 3, 2024. The first public beta release of Tailwind CSS v4.0 was on No… --- ## [Tooltip animation](https://forum.pinegrow.com/t/tooltip-animation/10145)
**Author:** [@jlpg](https://forum.pinegrow.com/u/jlpg)\ **Replies:** 1\ **Last updated:** [December 20, 2024, 4:02pm UTC](https://forum.pinegrow.com/t/tooltip-animation/10145 "2024-12-20T16:02:10Z")
How can I animate a Bootstrap 5.3 tooltip? I have managed to change the tooltip styles by manually modifying the CSS, as there is no way to do this visually in the program. Will this ever be possible? If you can’t sel… --- ## [How ti use @font-face](https://forum.pinegrow.com/t/how-ti-use-font-face/3706)
**Author:** [@Josan](https://forum.pinegrow.com/u/Josan)\ **Replies:** 8\ **Last updated:** [October 9, 2024, 8:37am UTC](https://forum.pinegrow.com/t/how-ti-use-font-face/3706 "2024-10-09T08:37:30Z")
Hi. My english is very limited, sorry. How to use @font-face in Pinegrow? Is there a tutorial? Thanks to all of you. --- ## [Uploaded fonts using @font-face won't show in the visual editor](https://forum.pinegrow.com/t/uploaded-fonts-using-font-face-wont-show-in-the-visual-editor/3581)
**Author:** [@red-rosefields](https://forum.pinegrow.com/u/red-rosefields)\ **Replies:** 6\ **Last updated:** [October 8, 2024, 9:34pm UTC](https://forum.pinegrow.com/t/uploaded-fonts-using-font-face-wont-show-in-the-visual-editor/3581 "2024-10-08T21:34:06Z")
Hello all, so I have added these fonts in my stylesheet but they won’t show in the Visual Editor. I have to go to the code and set them there manually. If you have 5 or 6 custom fonts and you are trying them out it fe… --- ## [CSS Grid with Talwind CSS](https://forum.pinegrow.com/t/css-grid-with-talwind-css/8913)
**Author:** [@TytanCodes](https://forum.pinegrow.com/u/TytanCodes)\ **Replies:** 1\ **Last updated:** [May 16, 2024, 8:35am UTC](https://forum.pinegrow.com/t/css-grid-with-talwind-css/8913 "2024-05-16T08:35:26Z")
Hello All. I am on using css grid and i want it to be responsive. I am using tailwind css. The video that shows how to use CSS grid from pinegrow says that he should’ve used classess. Talwind does use classes i think and… --- ## [Set the order of CSS links in head](https://forum.pinegrow.com/t/set-the-order-of-css-links-in-head/8710)
**Author:** [@verpapa](https://forum.pinegrow.com/u/verpapa)\ **Replies:** 3\ **Last updated:** [May 7, 2024, 1:03pm UTC](https://forum.pinegrow.com/t/set-the-order-of-css-links-in-head/8710 "2024-05-07T13:03:56Z")
Hi, I created Gutenberg blocks with their own custom CSS files. When export theme, the CSS files links generated BEFORE the theme default CSS links, so the modifications not effected in styles. How can I setup, that th… --- ## [Pinekit separate scss please](https://forum.pinegrow.com/t/pinekit-separate-scss-please/8644)
**Author:** [@AllMediaLab](https://forum.pinegrow.com/u/AllMediaLab)\ **Replies:** 7\ **Last updated:** [February 1, 2024, 8:47am UTC](https://forum.pinegrow.com/t/pinekit-separate-scss-please/8644 "2024-02-01T08:47:33Z")
@matjaz Hi, Have just been looking at the new Pinekit (really awesome design!), but noticed that the Pinekit spits out pinekit.css that consist of the latest Bootstap css and the theme together. Normally you would keep… --- ## [Chain only right-left padding?](https://forum.pinegrow.com/t/chain-only-right-left-padding/4788)
**Author:** [@beno](https://forum.pinegrow.com/u/beno)\ **Replies:** 12\ **Last updated:** [January 24, 2024, 3:26pm UTC](https://forum.pinegrow.com/t/chain-only-right-left-padding/4788 "2024-01-24T15:26:25Z")
Is it possible to chain only the right-left padding controls (not all paddings including the top and bottom)? Some modifier key or any other way? Thanks! --- ## [Tailwind DaisyUI defaulting to dark in Pinegrow](https://forum.pinegrow.com/t/tailwind-daisyui-defaulting-to-dark-in-pinegrow/8588)
**Author:** [@kris](https://forum.pinegrow.com/u/kris)\ **Replies:** 18\ **Last updated:** [December 22, 2023, 6:34pm UTC](https://forum.pinegrow.com/t/tailwind-daisyui-defaulting-to-dark-in-pinegrow/8588 "2023-12-22T18:34:47Z")
I installed the DaisyUI plugin for Tailwind with the external compiler option. From a little testing, it seems to be working on my website just fine. However, the Pinegrow editor defaults to DaisyUI’s dark theme. I’ve t… --- ## [Tailwind auto-complete](https://forum.pinegrow.com/t/tailwind-auto-complete/8587)
**Author:** [@kris](https://forum.pinegrow.com/u/kris)\ **Replies:** 0\ **Last updated:** [December 19, 2023, 9:04pm UTC](https://forum.pinegrow.com/t/tailwind-auto-complete/8587 "2023-12-19T21:04:34Z")
Is there a way to get the “Tailwind Add Classes” modal to auto-complete for all Tailwind’s base classes? For example, “aspect-square” and “aspect-video” didn’t appear until I entered each completely. See image, note tha… --- ## [Mobile scroll bar should not take up page space - it causes wrong design implementation](https://forum.pinegrow.com/t/mobile-scroll-bar-should-not-take-up-page-space-it-causes-wrong-design-implementation/8320)
**Author:** [@zarko](https://forum.pinegrow.com/u/zarko)\ **Replies:** 0\ **Last updated:** [August 25, 2023, 12:16am UTC](https://forum.pinegrow.com/t/mobile-scroll-bar-should-not-take-up-page-space-it-causes-wrong-design-implementation/8320 "2023-08-25T00:16:51Z")
The scroll bar in the Pinegrow preview is counted as part of the website and is taking up horizontal space that would, in reality, be usable. For instance, I often rely on the “vw” unit to size text, and this is how it … --- ## [Highlight the current page in the menu items on a WordPress site](https://forum.pinegrow.com/t/highlight-the-current-page-in-the-menu-items-on-a-wordpress-site/8151)
**Author:** [@red-rosefields](https://forum.pinegrow.com/u/red-rosefields)\ **Replies:** 3\ **Last updated:** [June 14, 2023, 2:00pm UTC](https://forum.pinegrow.com/t/highlight-the-current-page-in-the-menu-items-on-a-wordpress-site/8151 "2023-06-14T14:00:18Z")
Hello all, I have built a Wordpress site with a few pages. I am using Blocks for everything. From the menu to the footer. Everything are blocks. I still have not figured out, in the menu, how to highlight the current p… --- ## [Pinegrow is rewriting my template meta data](https://forum.pinegrow.com/t/pinegrow-is-rewriting-my-template-meta-data/8069)
**Author:** [@Xtrodinary](https://forum.pinegrow.com/u/Xtrodinary)\ **Replies:** 0\ **Last updated:** [May 27, 2023, 11:10am UTC](https://forum.pinegrow.com/t/pinegrow-is-rewriting-my-template-meta-data/8069 "2023-05-27T11:10:22Z")
When I am creating template with Pinegrow, my style.css is acting weird. I have created my own metadata for template, as seen below. But Pinegrow during export creates another metadata section above my already created m… --- ## [Wp blocks plugin backend style not working](https://forum.pinegrow.com/t/wp-blocks-plugin-backend-style-not-working/8024)
**Author:** [@matteobanana](https://forum.pinegrow.com/u/matteobanana)\ **Replies:** 7\ **Last updated:** [May 27, 2023, 4:21am UTC](https://forum.pinegrow.com/t/wp-blocks-plugin-backend-style-not-working/8024 "2023-05-27T04:21:05Z")
Hi everybody I’m creating a plugin to improve the default blocks library with some custom navigation elements. To ensure the blocks editablility I follow the suggestion on the tutorials: I created a custom backend css … --- ## [CSS grid style attribute menu not visible](https://forum.pinegrow.com/t/css-grid-style-attribute-menu-not-visible/7756)
**Author:** [@spindrift](https://forum.pinegrow.com/u/spindrift)\ **Replies:** 1\ **Last updated:** [March 3, 2023, 2:21am UTC](https://forum.pinegrow.com/t/css-grid-style-attribute-menu-not-visible/7756 "2023-03-03T02:21:46Z")
I am following the YouTube tutorial 'Learn CSS Grid with Pinegrow #4 - positioning with named areas. While trying to do this myself (macos 13.2, pg 7.2 trial) at around 1:50 where it is explained how to change the style … --- ## [Any way to customize core blocks and change teh theme.json easily in pinegrow](https://forum.pinegrow.com/t/any-way-to-customize-core-blocks-and-change-teh-theme-json-easily-in-pinegrow/7762)
**Author:** [@smgitner](https://forum.pinegrow.com/u/smgitner)\ **Replies:** 3\ **Last updated:** [February 28, 2023, 2:24pm UTC](https://forum.pinegrow.com/t/any-way-to-customize-core-blocks-and-change-teh-theme-json-easily-in-pinegrow/7762 "2023-02-28T14:24:43Z")
I find PG’s custom block capabilities pretty awesome, but sometimes I’d like to use the core blocks built into WordPress. But to customize those i find it difficult to go through the theme.json file. Is tehre any way to … --- ## [Styling of blocks](https://forum.pinegrow.com/t/styling-of-blocks/7759)
**Author:** [@xokko](https://forum.pinegrow.com/u/xokko)\ **Replies:** 0\ **Last updated:** [February 19, 2023, 11:31am UTC](https://forum.pinegrow.com/t/styling-of-blocks/7759 "2023-02-19T11:31:03Z")
I try the WP Plugin and would like to suggest a feature. Maybe it is already on the way with the (soon?) coming FSE support? When I create a block containing eg a button, it shows as standard (ugly grey). I use the 2023… --- ## [Pinegrow removes the quote characters when generating the css](https://forum.pinegrow.com/t/pinegrow-removes-the-quote-characters-when-generating-the-css/7736)
**Author:** [@MONO](https://forum.pinegrow.com/u/MONO)\ **Replies:** 2\ **Last updated:** [February 18, 2023, 9:33am UTC](https://forum.pinegrow.com/t/pinegrow-removes-the-quote-characters-when-generating-the-css/7736 "2023-02-18T09:33:01Z")
Pinegrow removes the quote characters when generating the css file: for example: SCSS: nav\[aria-label=“Main”\] { … } CSS nav\[aria-label=Main\] { … } Pinegrow PRO 7.2 / MacOS (M1) --- ## [Easily position and center HTML elements with Flexbox](https://forum.pinegrow.com/t/easily-position-and-center-html-elements-with-flexbox/7751)
**Author:** [@matjaz](https://forum.pinegrow.com/u/matjaz)\ **Replies:** 2\ **Last updated:** [February 17, 2023, 11:28pm UTC](https://forum.pinegrow.com/t/easily-position-and-center-html-elements-with-flexbox/7751 "2023-02-17T23:28:06Z")
Here is a quick interactive example on how to use Flex to position HTML elements: Here is a quick video: It also includes AI Assistant and Flexbox jokes: --- ## [CSS Smooth animation](https://forum.pinegrow.com/t/css-smooth-animation/7695)
**Author:** [@excede](https://forum.pinegrow.com/u/excede)\ **Replies:** 2\ **Last updated:** [February 1, 2023, 9:11pm UTC](https://forum.pinegrow.com/t/css-smooth-animation/7695 "2023-02-01T21:11:56Z")
Can anyone suggest a really efficient way to do this fade and slide in as it seems to be glitchy (and I’m seeking perfection). CSS only perhaps? --- ## [V7, Breakpoints, media queries and the new tabs](https://forum.pinegrow.com/t/v7-breakpoints-media-queries-and-the-new-tabs/7687)
**Author:** [@excede](https://forum.pinegrow.com/u/excede)\ **Replies:** 2\ **Last updated:** [January 24, 2023, 9:36am UTC](https://forum.pinegrow.com/t/v7-breakpoints-media-queries-and-the-new-tabs/7687 "2023-01-24T09:36:41Z")
So I noticed in version 7 there’s some new tabs in the top right corner that are meant to work with breakpoints and media queries or rules but I’m not exactly sure how to utilise them. Is there any documentation on the n… --- ## [Hover styles confusion](https://forum.pinegrow.com/t/hover-styles-confusion/7673)
**Author:** [@Guido](https://forum.pinegrow.com/u/Guido)\ **Replies:** 0\ **Last updated:** [January 21, 2023, 12:56pm UTC](https://forum.pinegrow.com/t/hover-styles-confusion/7673 "2023-01-21T12:56:53Z")
Hi, I created a button that has it’s style on .btn and hover styles on .btn:hover. But in the style panel it shows as the hover styles overriding the .btn styles. It only does if you actual hover of course but it just … --- ## [PGIA Gallery active thumb overlaps navbar](https://forum.pinegrow.com/t/pgia-gallery-active-thumb-overlaps-navbar/7626)
**Author:** [@aquorange](https://forum.pinegrow.com/u/aquorange)\ **Replies:** 0\ **Last updated:** [January 13, 2023, 4:34pm UTC](https://forum.pinegrow.com/t/pgia-gallery-active-thumb-overlaps-navbar/7626 "2023-01-13T16:34:44Z")
When scrolling a pgia gallery with thumbs over the navigation bar of a bootstrap 4 onepage site (blueprint with pgia animated sections) the current thumb overlaps the bar. It has z-index:1, but that doesn’t seem to matte… --- ## [Showcase - A simple site built in no-time with PG and css grid](https://forum.pinegrow.com/t/showcase-a-simple-site-built-in-no-time-with-pg-and-css-grid/7602)
**Author:** [@red-rosefields](https://forum.pinegrow.com/u/red-rosefields)\ **Replies:** 3\ **Last updated:** [January 9, 2023, 3:36pm UTC](https://forum.pinegrow.com/t/showcase-a-simple-site-built-in-no-time-with-pg-and-css-grid/7602 "2023-01-09T15:36:53Z")
Hi all, just wanted to showcase a very simple static site built with PG in 2 hours thanks to PG and it’s CSS grid GUI. Right now is just HTML. Next on, I will converted to a WP theme using wp blocks. See how it goes. h… [Next page](https://forum.pinegrow.com/tag/css/8.md?match_all_tags=true&page=1&tags%5B%5D=css)