# Duplicate rule into new .css

**URL:** <https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479>\
**Category:** Beginners\
**Created:** [July 18, 2021, 8:28pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479 "2021-07-18T20:28:48Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [July 18, 2021, 8:28pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/1 "2021-07-18T20:28:48Z")

</div>

Can’t duplicate rule into style.copy.css from bootstrap.css. Help please.

 ![Screen Shot 2021-07-18 at 1.19.09 PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/8/855fb6ba5b31a85afe56b4ee883cefc75cc60254.png)  
 ![Screen Shot 2021-07-18 at 1.20.06 PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/0/0dc3577fff6d76188c03bfa30521bc2f31f08fcb.png)

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [July 19, 2021, 9:46am UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/2 "2021-07-19T09:46:15Z")

</div>

Hi @kat,  
Your screenshots are a little confusing. It looks like you have a rule selected in you `style.copy.css` file selected when you are pulling up the context menu. You should have the rule selected in the bootstrap.css section, then right-click for the context menu, select `style.copy.css` in the duplicate dropdown, and then click on duplicate. Sometimes people forget this last step.  
Hope this helps,  
Bob

---

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [July 19, 2021, 11:29pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/3 "2021-07-19T23:29:23Z")

</div>

How do I get a new bootstrap.css in case I accidentally overwrote anything?

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [July 20, 2021, 9:13am UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/4 "2021-07-20T09:13:28Z")

</div>

From the “Components” menu select “Add/Update resources from libraries…”. Then in the pop-up select the overwrite checkbox at the bottom and choose to update for the whole project.  
Cheers,  
Bob

---

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [July 20, 2021, 5:34pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/5 "2021-07-20T17:34:37Z")

</div>

I’m trying to get rid of extra space but still can’t duplicate BT css. So far what works is to write the rule directly in VSC css panel and edit there. Would prefer to copy BT rule by control clicking to add to style.copy.css in PG. But duplicate in blue panel clicking or hitting return does nothing. Help please.

 ![DuplicateBT_rule](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/6/658e5391d9b4ed67d7bef38c16e3970c68946b3d.jpeg)

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [July 20, 2021, 6:24pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/6 "2021-07-20T18:24:35Z")

</div>

Hi @kat,  
Two things,

1. After selecting where to copy the rule, are you clicking “Duplicate”?
2. Be careful about over-riding CSS by just making a duplicate rule. The only reason your new rule would over-ride the old one is the load order. Just keep this in mind.  
Cheers,  
Bob

---

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [July 20, 2021, 9:55pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/7 "2021-07-20T21:55:49Z")

</div>

1. Dropdown blue panel\>Duplicate in: style.copy.css  
I tried clicking in the blue panel and hitting return.  
I don’t see anywhere I can click “Duplicate.”

2. I there a different way to change the rules that apply the padding and ::before and ::after?

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [July 21, 2021, 9:38am UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/8 "2021-07-21T09:38:11Z")

</div>

Hi @kat,  
After selecting the rule and opening the dropdown:

 ![-users-robertmeans-dev-kat-dup-indexhtml---pinegrow-web-editor---wp](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/8/8bf0ea15596c9334d7ca09d8d9b034ecc3149eca.jpeg)  
And the result is (starting with an empty style.css file):  
 ![-users-robertmeans-dev-kat-dup-indexhtml---pinegrow-web-editor---wp-1](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/e/e7a8d5fa65fa72ef3109100355ce5954dfbeff70.jpeg)

With regards to changes to the padding on the p element. Each part of a CSS selector has a different value (sort of). Those with higher values will over-rule those with lower values. A “class” selector has a higher value than an element selector. In Bootstrap you overcome padding values by adding a class. So a base paragraph element has a `margin-bottom` of `1rem`. This can be overcome within Bootstrap by adding a class of `.mb-0`. This will give it a `margin-bottom` of `0` - padding is almost the same `.pb-0`. If you want a custom value I recommend adding a new class, for example `kat-pb`. But then, create a selector of `p.kat-pb` to create the actual rules. That way it has a higher value than just `p` alone. Bootstrap makes use of `!important` a lot! Can’t really overcome that except with another `!important`, so just make sure you don’t have any conflicting classes from Bootstrap like `.pb-0` on the same element.  
Cheers,  
Bob

---

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [July 22, 2021, 12:42am UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/9 "2021-07-22T00:42:39Z")

</div>

1. Your explanation was a huge help, Rob and the click on Duplicate in the image was perfect!

2. Here is a helpful old PG Page tutorial (date stamped). But really hard to find on youtube. [Pinegrow Walkthrough - YouTube](https://youtu.be/q0SA2NxJbOU?t=452)  
I’m hoping you’ll do update.

3. Should I make new classes to control Surprise me new fonts & colors?

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [July 22, 2021, 9:18am UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/10 "2021-07-22T09:18:45Z")

</div>

Hi @kat,  
I recently did a tutorial on adding CSS in Pinegrow, but realize now that I only covered duplicating a rule, not duplicating to a new sheet.

I’m not sure what you mean for the surprise me. When you click that it will change existing colors and fonts unless you have them locked. Any new color classes or font classes will also be changed. It just depends on what you want to achieve.

Cheers,  
Bob

---

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [July 22, 2021, 4:02pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/11 "2021-07-22T16:02:23Z")

</div>

> [@RobM](#):
>
> I recently did a tutorial on adding CSS in Pinegrow

Can you give me the url please?

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [July 22, 2021, 4:08pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/12 "2021-07-22T16:08:08Z")

</div>

Sure! [Styling with CSS in Pinegrow – A short tutorial | Pinegrow Web Editor](https://pinegrow.com/tutorials/styling-with-css-in-pinegrow/)

---

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [July 22, 2021, 4:59pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/13 "2021-07-22T16:59:21Z")

</div>

> [@RobM](#):
>
> [Styling with CSS in Pinegrow – A short tutorial | Pinegrow Web Editor](https://pinegrow.com/tutorials/styling-with-css-in-pinegrow/)

Excellent, this is great, lots easier there sifting thru PG on youtube

---

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [July 23, 2021, 7:18pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/14 "2021-07-23T19:18:05Z")

</div>

What does “TypeError: dp.useTailwindJIT is not a function” mean? It’s now popping up constantly when attempting to edit Bootstrap containers card padding.

Got any new tutorials on editing Bootstrap elements, if so url please.

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [July 23, 2021, 8:02pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/15 "2021-07-23T20:02:05Z")

</div>

Hi @kat,  
We have encountered this error and it will be fixed in the next version coming soon. In the meantime, open the “\_pginfo” folder in your project and delete the “class.tracker.json” file. This should take care of it.  
Cheers,  
Bob

---

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [July 23, 2021, 8:30pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/16 "2021-07-23T20:30:03Z")

</div>

> [@RobM](#):
>
> open the “\_pginfo” folder in your project and delete the “class.tracker.json” file.

1. Not there  
 ![Screen Shot 2021-07-23 at 1.29.24 PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/c/c23561f741486e78f7fd59b9052f7a420ce6d936.png)
2. PG 6 is really slowing down and getting stuck. Suggestions. Possibly deleting backups?  
 ![Screen Shot 2021-07-23 at 2.04.01 PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/5/552b0ee493fa2c4b25f2719ba8ab71b4217aef59.png)

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [July 23, 2021, 9:06pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/17 "2021-07-23T21:06:51Z")

</div>

Huh, can you check using the OS file explorer? Maybe Pinegrow isn’t updating the files.  
Thanks,  
Bob

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [July 23, 2021, 9:08pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/18 "2021-07-23T21:08:54Z")

</div>

You can try deleting backups - shouldn’t matter. We might need to look at your project.

---

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [July 23, 2021, 9:18pm UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/19 "2021-07-23T21:18:34Z")

</div>

> open the “\_pginfo” folder in your project and delete the “class.tracker.json” file

“class.tracker.json” just showed up. I deleted it. I close and reopen a lot; command R doesn’t seem to do the trick.

Watched your SVG and a bunch of bootstrap tutorials. They help a lot.

---

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [July 24, 2021, 1:45am UTC](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479/20 "2021-07-24T01:45:44Z")

</div>

> [@RobM](#):
>
> OS file explorer

Where is OS file explorer? This is happening in my big top level project and small poetry project

[Next page](https://forum.pinegrow.com/t/duplicate-rule-into-new-css/5479.md?page=2)
