I want to add a CSS circle and a box with an up arrow into one of my Divs.
The code for the up arrow is:
.arrow_box {
position: relative;
background: #88b7d5;
}
.arrow_box:after {
bottom: 100%;
left: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(136, 183, 213, 0);
border-bottom-color: #88b7d5;
border-width: 30px;
margin-left: -30px;
Where do I put this in webflow?
Thanks!
Drop an embed component into the bottom of the page, and paste the CSS code wrapped with <style></style> tags. This will allow you to preview it in the designer.
Once you are okay with the div, move that code to
Site Settings > Custom Code > Header Code
This will apply the changes site-wide, but will only take effect on published sites and cannot be seen in the designer.
Little note: if add this code snippet to the embed code on the page it will be visible in the Designer mode 
Here is a nice site, where it lists the easy to use css styles which you can recreate in Webflow by adding a class to a div, and then enter the styles shown in the example:
https://css-tricks.com/examples/ShapesOfCSS/
Some of the shapes might need custom css, but still fun 
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.
