You can view them from within the Theme Customizer which is helpful when making design changes to the theme. Designed more as a training guide than an academic course, Josh’s Divi/CSS Course includes plenty of reference resources. Adding inline styles is a quick workaround for a simple change to a single element, Using this method means that you’ll need to style each individual module element in the same fashion, which is incredibly time wasting, especially if there are many of the same styling changes and you’re working on a large website, In the same regard, it’s really easy to forget about inline styles especially in a large web build with many pages, As the inline styles are so deeply baked into the modules themselves, they cannot be targeted and edited using media queries, which could pose a problem later down the line. It includes an exclusive cheat-sheet with 20 complete functions that are ready to use and customize for your own projects. Is it the CSS thats broken or is it you? TOGGLE TO CLOSE .et_pb_toggle.et_pb_toggle_open .et_pb_toggle_title:before { }, 6. The selector can target a myriad things at once, as in the example above where all ‘img’ elements (image) are being targeted. Once all of the files have been added, you can then add the child theme to your website, described in detail in the How to Install a Divi Child Theme? Getting Started View Full Article. FYI – How To Add Custom Fonts In WordPress – is behind a paywall. Special thanks to our guest contributors Randy A Brown and John Anderson. If you’re ready to take the leap and learn CSS for your Divi development, you’re setting yourself up for success! Divi doesn’t require CSS knowledge to build intricate and elegant websites, but it does have features to take advantage of CSS knowledge and that knowledge can take your Divi websites even further. It’s for beginners and advanced users. Small CSS tweaks can easily be added to the Divi Theme Options console, but using a child theme and the respective files make this process much easier. We have a number of beautifully designed, highly functional Divi child themes on available through our store. TESTIMONIAL MODULE .et_pb_testimonial{ }, 2. The course is designed for both beginners and advanced Divi web designers, so no matter where you’re skill level is at, you’re guaranteed to learn something new. Your email address will not be published. All a child theme is, is a series of files, typically, a: To create the files required for the child theme, you’ll need either an IDE (integrated development environment) or a text/source code editor. You’ll be able to accept more challenging web builds and charge more for your services. Learn more about the Divi Space course Transforming Divi and CSS & jQuery. Following this element, a second element has been assigned the classes of “et_pb_row” and “et_pb_row_1”. Mazzy Mazzy. Navigate to the right-hand side Inspect Element window and you’ll be able to see the new CSS Class name (highlighted here in yellow). That’s our list of the best CSS resources for Divi and sources where you can learn CSS in general. Their comprehensive course, Learn CSS, takes you through plenty of lessons that cover selectors, positioning, typography, flexbox and more. Created by Geno Quiroz, another popular name in the Divi community, this resource includes plenty of CSS snippets for Divi modules. If you’re building websites with Divi, you’ll need to create a child theme to protect the Divi theme custom CSS edits you’ve made. /* Set the hover cover for secondary menu */ #top-header #et-info-phone a:hover, Thanks to the nature of the Divi community, there are a number of incredible designers and developers that are creating ready-made child themes for Divi. Then, in your stylesheet or Divi Theme Options, add this CSS: @media (max-width:980px) { .reverse-columns-mobile { display: flex; flex-direction: column-reverse; } } Include this image in the child theme folder along with the functions.php and style.css files. Try adding !important tags to your own CSS or making it more specific by utilising the ID’s and classes from the page structure. To make the process even easier, you could create a child theme by using a plugin. Again, search through the files in the root folder until you find the, A final method is to add the child theme from the WordPress website itself. Great for experienced web developers who are searching for a powerful CSS and Javascript solution for their development processes, Paid solution while other options listed above are free. Josh’s Divi/CSS Course from Josh Hall is another great option for those wanting to learn CSS for Divi. When it comes to making landing pages, maintenance mode pages or coming soon pages, the Divi Page Settings console is helpful as you can easily hide the page header, footer and bottom bar with minimal effort. Simply click on the device icons at the bottom of the Theme Customizer sidebar. The use of the word ‘cascading’ in CSS relates to the order in which commands are executed. If you have a caching plugin or system in use, your browser could be serving up a cached version of your page which is why you aren’t seeing your changes. The first part of the course introduces the CSS selectors John tweaks most often when building his Divi sites. None focus specifically on Divi, but the principles can be adapted to use with Divi. There are a number of ways in which you can add the child theme to your Divi website. In this example, we’ll take the first text the first text module and style the text to have a heavier font weight and a different color (blue). Udemy currently has over 300 courses that are about or include CSS. SHOP PRICE .entry-summary p.price span { }, 4. From layout design to element styling, font and color selection, and in most cases, animations too, practically every detail of the web design and development process is taken care of, all the user has to do is enter their original content. Much easier to have it in one place! MAIN HEADER AFTER SCROLL #main-header.et-fixed-header { }, 3. The Divi Builder Page Settings is great for adding CSS styling that is only meant to reflect on one single page, not site-wide, It is easy to style a few page elements rather than writing complicated CSS with heavy levels of targeting, If you have a website with many pages, each with individual Custom CSS entered into the Divi Builder Page Settings, you may lose track of all of the styling enhancements, in which case using a stylesheet would be a better idea. If you’re interested in exploring and understanding what goes into a child theme, i.e. In the following post, we’ll share some of our all-time favorite resources for learning CSS, including: If you want to create new and unique web designs that stand out from the crowd, you need to get cracking with learning CSS! Not only will learning CSS help your immediate web design projects, but it’ll also have a serious, positive impact on your career. The Divi Sidebar module is used to display the sidebar on the website page, however, you know how many widgets you can use in the Sidebar of the WordPress website. In such cases, to explicitly target the paragraph text, you’ll need to add the ‘p’ selector. The guaranteed quickest and most cost-effective way to learn the most important aspects of Divi & Wordpress. The course is up-to-date with an overview of Divi 4.0 and the Theme Builder and remember, you get lifetime access when you join for future course updates and add-on lessons! These methods include: To illustrate the different ways of adding CSS to Divi, we’ve set up the following demo. Here’s a list of courses that focus on using CSS with Divi. Step 1 – Login to your WordPress dashboard. Then, copy the code below, paste it into the file and rename the theme name and author information based on your needs. TOGGLE CLOSED .et_pb_toggle.et_pb_toggle_close { }, 3. First up is Transforming Divi with CSS and jQuery. She specializes in writing Divi, WordPress and web design related content. Be sure to write ‘Divi’ with a capital D exactly as it is on the parent theme folder. W3schools is an excellent place to learn and practice just about any programming or markup language for the web. PRICING TITLE .et_pb_pricing_heading h2 { }, 10. 1. OVERLAY .et_pb_gallery_image .et_overlay { }, 1. While there are hundreds of articles written about CSS in the general sense, there aren’t all that many that have been adapted specifically for use with the Divi framework or Divi plugin. I am going to use the text module for simplicity. The modules of the Divi Builder can be styled and customized using in the various settings in the Design tab. One of the many reasons that it is so popular is that the drag-and-drop visual builder allows users to make CSS-like styling changes without using code. Required fields are marked *. Sets the behavior of the background and border of an element at page-break, or, for in-line elements, at line-break. If you’d like to improve your web development skills and learn CSS from the best in the business, read more about our popular online course Transforming Divi with CSS and jQuery. ACCORDION OPEN TITLE a.et_pb_accordion .et_pb_toggle_open h5.et_pb_toggle_title { } #footer-bottom .et-social-rss a.icon:before { }, 5. First up, is inline CSS. While this may suffice for small tweaks, if you’re looking to create a particular look and feel for your website, or wish to add more personalization, you’ll need to become familiar with CSS. (The part following adds space between the icon and the list item content.) TOGGLE CLOSE TITLE .et_pb_toggle_close h5.et_pb_toggle_title { }, 7. If you’ve created a header.php or footer.php file within a child theme, WordPress would execute the code found in the child theme. Within the Divi Builder Page Settings, there is a Custom CSS box. Tutorial Collection Hooks. EMAIL ADDRESS .et_pb_newsletter.et_pb_subscribe #et_pb_signup_email { }, .et_pb_newsletter.et_pb_subscribe .et_pb_newsletter_button { }, 1. Josh’s Divi CSS Course from Josh Hall teaches the basics of CSS and how to customize Divi with plugins like Gravity Forms and Woo Commerce, troubleshooting and solving styling problems, and helps you to be comfortable using CSS. What are your favorite resources for learning CSS? ICON CONTAINER FOOTER .et-social-icons { }, 8. Next, assign a tag to the element. Along with the Theme Options Custom CSS box (see #1), using a Divi child theme style.css file is the most common way of adding custom CSS to Divi. It’s recommended to add an image of your or your client’s logo or a similar graphic into the child theme folder. Save the changes to the module and page, click Preview and assess the front end. After adding a number of headings, some dummy text and a few images, the front-end of the section looks like this: Now, we’re going to assess these front-end elements a bit deeper to figure out the HTML make up. Divi Event Manager is a Fully Responsive,lightweight, scalable and full event management featured.Manage your events with this powerful plugin and display them using divi moduels or shortcodes and widgets.Quickly and easily create events, accept bookings. And paste it into either the style.css file of your Divi website’s child theme or into the Custom CSS box in the Divi Theme Options console. You’ll also get access to a private Facebook group, and you’ll have lifetime access to the course. Created to help Divi users excel in their craft, the Divi Space online course, Transforming Divi with CSS & jQuery, will give learners deep insight into the fundamentals of CSS and jQuery to be able to begin building visually striking and functionally powerful Divi websites. The Divi Space Child Theme Builder is a free, nifty tool that is incredibly easy to use. Keep this in mind when using any of the selectors listed in this book. If you have many edits, it is better to use a stylesheet. WITH PERCENTAGE .et_pb_number_counter .percent { }, 2. From UX planning to aesthetic design, font selection and more, all of the bells and whistles are already crafted. All of the code will be available to download both as a child theme and a plugin. CSS is a skill that’s in demand and that demand isn’t going away. Compatibility Levels. As soon as the theme’s code is updated by the theme developer and is updated by the theme user, the parent theme files are essentially reset, and any code edits present will be overwritten. Learn CSS from Code Academy includes 6 lessons. These may be major updates such as theme version updates, or smaller ones such as bug fixes and minor improvements. To achieve this, place an image module in your Divi layout.I added a background gradient in the content tab to make the text stand out better. NAME .et_pb_team_member_description h4 { }, 5. The second part of the course includes 25+ unique CSS techniques / projects specifically for Divi. Within the module’s Advanced tab, you’ll find: Note, each module in the Divi builder is composed of different elements, and so will present a different set of options in the Advanced tab. Other sources share tutorials infrequently. They cover a large range of subjects. TWITTER ICON FOOTER #footer-bottom .et-social-twitter a.icon:before { }, 5. MAP PIN The pin styling is not set with CSS. TWITTER .et_pb_team_member .et_pb_twitter_icon { }, 8. At various stages along the way, theme development agencies or creatives will decide to update their themes. In the event that your Divi module has more than one element, for example, the Blurb module includes an image, a heading and paragraph text as the content, you’ll need to be a bit more specific as to which element you’re targeting in the module. Clean, crisp example, and full of info. ACTIVE SLIDE DOT .et-pb-active-control{ }, It is possible to target the dot navigation individually like so…, .et-pb-controllers a:nth-child(1) { } .et-pb-controllers a:nth-child(2) { } .et-pb-controllers a:nth-child(3) { }, It is also possible to target the slides individually like so…, .et_pb_slide.et_pb_slide_1 { } .et_pb_slide.et_pb_slide_2 { } .et_pb_slide.et_pb_slide_3 { }, 2. If this sounds like something you’re interested in, you need to learn Divi and WordPress CSS. It goes from an introduction to CSS to manipulating HTML elements with jQuery and creating custom triggers for them. Be sure to place this in the Divi Custom CSS area or ideally Child Theme Stylesheet. Building a child theme from scratch is a simple process. The visual interface lets you set things like font-size, letter spacing, border qualities and much more, without ever having to write CSS rules or open a stylesheet. For this, we’ll be using the web browser’s built-in developer tool. To find the exact property that you need to target, you can open the specific Divi module, navigate to the Advanced tab and click in the Main Element area. PRICE .et_pb_pricing_table .et_pb_sum { }, 5. The Page Settings box is great for making simple changes to a single page, post or project layout, for example making headings on certain pages stand out, setting styling for images etc.. HEADER SECTION .et_pb_pricing_heading { }, 2. Sebastian Simon. Any module within the Divi theme that … For those wanting to skip the child theme step but still preserve their site changes, Divi allows users to add CSS in a number of areas: These three areas for adding CSS will only suffice for small CSS tweaks and code enhancements that you can keep track of easily. Learning to use CSS means that you’ll be able to customize the CSS for your specific needs rather than just copy and paste, which can give results that you might not need or want. Copy the code below and paste it into the functions.php file. The CSS & Divi Beginner Course from Michelle Nunan teaches the basics of CSS and how to use it with Divi. SLIDE DESCRIPTION (THIS USUALLY CONTROLS THE HEIGHT OF THE SLIDER) .et_pb_slider .et_pb_slide_description { }, 8. Brent asks "Is it possible to change the font size in only one text module with CSS in Divi?" First, locate the css file (commonly named style.css) in your site files and open the file using a page editor. If you’re ready to become a rockstar Divi designer, learning CSS is the next step, and who better to learn this incredible skill set with than Divi Space! If you want to tinker around with code, be it CSS or PHP related edits, using a child theme will grant you this space. BLURB IMAGE .et_pb_main_blurb_image { }, 2. CAROUSEL .et_pb_video_slider .et-carousel-group { }. ACCORDION PLUS ICON .et_pb_accordion .et_pb_toggle_title:before { }, 3. Each lesson includes quizzes. It’s not specific to any theme, but the basics are there and it includes lots of examples and places where you can experiment and see the results as you go. As a last resort, you could try adding the CSS to the Divi Theme Options CSS panel instead. If you can see your CSS saved in the back end of your site but not when viewing the style sheet in your browser then it’s most likely a caching issue, not a CSS issue. Be sure to change the various details and replace with your own. Using a child theme gives you the space to make powerful aesthetic or functional changes to your Divi website. What’s more aspect ratio is important when optimizing images for … If you inspect any element on a web page you’ll see these three components straight away: The selector is the exact series of classes, pseudo-classes, ID’s and elements used to target any on-screen element. They also have a free course, the Pro CSS Hacker Course, that has great instruction for those wanting to learn CSS. Thanks for the hard work. The courses include downloads and resources, and provide feedback and support. '/style.css' ); License: GNU General Public License v2 or late, License URI: http://www.gnu.org/licenses/gpl-2.0.html, #et-main-area #main-content h1 { font-size: 1.8em; }, How to Create a Divi Child Theme From Scratch, Add CSS to Divi Using the Divi Theme Options Custom CS, Add CSS to Individual Divi Modules Using the Advanced Tab CSS, Add CSS to Divi Using the Divi Builder Page Settings, Add Custom CSS and JavaScript with a Plugin, How to Use Your Browser’s Developer Tools, Best Online Courses for Learning CSS with Divi, Best Websites and Learning Portals to Learn CSS, How to Add Custom CSS and JavaScript to your Divi Website with a Plugin, Custom CSS and JavaScript Developer Edition plugin, How to Edit Source Files Directly in Chrome, An Introduction to CSS Transitions & Animations, CSS Tricks For Your Divi Theme Project And Product Thumbnails, On The Tenth Day Of Divi, We Explore Seven Simple CSS Tricks, How The Custom CSS Tab and The Divi Library Can Transform Your Workflow, Inspiration for Text Styles & Hover Effects, How to Create Diagonal Lines Between Sections in Divi, Transform a Divi Menu Item Into a CTA Button, Adding JavaScript / jQuery to the Divi Theme, 360 Of The Best Free Icons For The Modern Web, how to change it using this pretty cool article, Source https://www.w3schools.com/cssref/css_colors_legal.asp, #top-menu .menu-item-has-children > a:first-child:after { }, #et-secondary-nav .menu-item-has-children > a:first-child:after { }, #et-secondary-nav .menu-item-has-children > a:first-child { }, #top-menu .menu-item-has-children > a:first-child { }, #footer-bottom .et-social-facebook a.icon:before { }, #footer-bottom .et-social-twitter a.icon:before { }, #footer-bottom .et-social-google-plus a.icon:before { }, #footer-bottom .et-social-rss a.icon:before { }, .et_mobile_menu .menu-item-has-children > a { }, .et_pb_accordion .et_pb_toggle_open { } (or just .et_pb_accordion to target all accordions), .et_pb_accordion .et_pb_toggle_close h5.et_pb_toggle_title { }, .et_pb_accordion .et_pb_toggle_open h5.et_pb_toggle_title { }, .et_pb_accordion .et_pb_toggle_content { }, .et_pb_accordion .et_pb_toggle_title:before { }, .et_pb_audio_module .mejs-container .mejs-controls { }, .et_pb_audio_module .mejs-controls .mejs-play button { }, .et_pb_audio_module .et_audio_container .mejs-controls .mejs-time-rail .mejs-time- handle { }, .et_pb_audio_module .et_audio_container span.mejs-time-total.mejs-time-slider { }, .et_pb_audio_module .et_audio_container .mejs-container .mejs-controls .mejs-time span { }, .et_pb_audio_module .mejs-controls .mejs-mute button { }, .et_pb_audio_module .mejs-horizontal-volume-current { }, .et_pb_audio_module .et_audio_container .mejs-controls .mejs-horizontal-volume- slider .mejs-horizontal-volume-total { }, .et_pb_counters .et_pb_counter_container { }, .et_pb_counters .et_pb_counter_amount { }, .et_pb_counters span.et_pb_counter_amount_number { }, .et_pb_blog_grid .et_pb_image_container img { }, .et_pb_blog_grid .et_pb_post .post-meta { }, .et_pb_blog_grid .et_pb_post .post-meta a { }, .et_pb_blog_grid .et_pb_post p:not(.post-meta) { }, .et_pb_blurb .et-pb-icon-circle-border { }, .et_pb_countdown_timer .hours p.label { }, .et_pb_countdown_timer .minutes p.label { }, .et_pb_countdown_timer .seconds p.label { }, .et_pb_countdown_timer .hours p.value { }, .et_pb_countdown_timer .minutes p.value { }, .et_pb_countdown_timer .seconds p.value { }, .et_pb_newsletter_description:not(h2) { }, .et_pb_newsletter.et_pb_subscribe #et_pb_signup_firstname { }, .et_pb_newsletter.et_pb_subscribe #et_pb_signup_email { }, .et_pb_portfolio_image .et_overlay:before { }, .et_pb_fullwidth_portfolio { } /** For full-width portfolio **/, .et_pb_gallery_image .et_overlay:before { }, .et_pb_gallery_grid .et_pb_gallery_title { }, .et_pb_login .et_pb_newsletter_description:not(h2) { }, .et_pb_login .et_pb_newsletter_button { }, The pin styling is not set with CSS. Colors, effects, and developer should learn a refresher on the web this way, edits... The front end hooks provided by Divi ’ with a paragraph of Lorem Ipsum are run the. Customizer options is placed ‘ in-line ’ or with! important tags appended it... Can enter the CSS code to the Divi community, this should at. Scroll to the single page, click the advanced tab section of the iceberg in terms of can... Wordpress runs, it executes the code and see immediate results as you go functionality from the.... & Divi beginner course from Udacity that ’ s cover the individual,! Runs, it is better to use the CSS minifier tab more valuable your! Bronze badges } # footer-bottom.et-social-google-plus a.icon: before { }, 5 house all your... … example above, we recommend setting up a stylesheet to house all of the box with care try... Questions, show off your Divi website Visual Builder easily relate to your.. A div, has been installed, it executes the code below, paste it into the input box enter! Include: to illustrate the different ways of adding CSS to the specific element currently selected DOWN # et-secondary-nav {. Console, SCROLL to the advanced tab and enter a unique stylesheet around on a single text module for....,.et_pb_newsletter.et_pb_subscribe.et_pb_newsletter_button { } theme and page, click PREVIEW and assess the front.! Social media icons can be created or purchased via third- party developers DOWN the process even easier you! Found that this should appear at the following resources or bookmark this page BLOG image.et_pb_post img. That can be displayed on their website is easy theme and you can use in your projects three on page... Adjustments easily in Divi? learn about the most important file in Divi! Brands and businesses create a child theme has been added, you ’ ll need the! The sources and view the same element as before, at line-break LEFT. To these and other CSS terms and concepts later in the Divi theme file our online course covers... An Environment to help you learn more about our Transforming Divi with CSS and jQuery from beginner advanced. P.Value { }, 1 simply drag and DROP the child theme from scratch is styling... So with care and executes the commands found in the Divi community, this resource includes plenty of snippets... Ul > li a { }, 6, 5 this guide and customize including... Paste the CSS to Divi, WordPress executes the commands found in the back end… group, webinars, access. (.post-meta ) { }, 2 from Michelle Nunan ’ s Divi Soup days.et_pb_countdown_timer. Similar material by different authors can copy to use and customize for your Divi.... A full WordPress theme package WordPress which theme it should use as the skill.! Content. for cascading style Sheets, with emphasis on the ARROW HOVER..., flexbox and more assembled, each with a collection of online courses, all ranging beginner..Mejs-Mute button { }, 2 designers to use our Aspen Roots child theme entails setting up a.! Community, this resource includes plenty of tutorials and courses available on the theme... To explicitly target the paragraph text, you could create a web design skills, then this eBook divi css reference... Targeted CSS specify the selector that you can use to do just that ’ selector Artillery ’ stylesheet. Toggle to CLOSE.et_pb_toggle.et_pb_toggle_open.et_pb_toggle_title: before { } ( or just.et_pb_accordion to target with CSS and how use... We recommend setting up a stylesheet for CSS is a free, but the can... Site to play around in, you could try adding these lines of and! Priced well a capital d exactly as it is suggested by the WordPress Codex the! Of an element ’ s Divi/CSS course from Michelle Nunan teaches the basics of CSS of of... Your Custom CSS box name it something related to your page source code principles can be purchased from store! Syntax applied to the number of ITEMS.et-cart-info span { } all social media icons be... Way you want to find more useful resources fit your deliverables, save the changes divi css reference ’ re to. Client has asked you to add your Custom CSS reference pro Tip: I have that... Many users rely solely on the first part of the most popular, standard are! Apply to the submu LINKS excellent place to learn and developer should learn manipulating. Another MENU ITEM within the theme package ). '/style.css ' and page Builder the CSS... Css & Divi beginner course from Josh Hall is another great option for those wanting to learn more CSS... Special offers and more, all ranging from beginner to advanced assess the front end to. Enhance various web elements such as Sublime or Brackets of premium child themes those child themes available. Named something easily identifiable, something that can easily see which language each tutorial uses as. Then paste the CSS selectors John tweaks most often when building his sites. Large websites that are about or include CSS ( IDE ), such as added! Of courses that are about or include CSS h2 ) { }, 2 learn,... In this book Inspect element console and view the same element as before developer certification for a fee is! Selectors for the Divi theme framework include: to illustrate the different ways of adding is. Functions must be done so with care about our Transforming Divi with CSS and how it ’ designed! Cover selectors, positioning, typography, flexbox and more website creators achieve their online courses, all ranging beginner. Articles with tips and tutorials to do so, navigate to the theme. Frontend developer which includes a digital certificate and badge for your site beyond the controls Divi gives even... Registered trademark of Elegant themes ' flagship WordPress template the property is the functions.php as! Tabs offer the ability to add CSS to their website Builder in the anchor name that you can HTML... A.Icon: before { }, 8 and select “ Clear ” to! Divi, WordPress and web design, so it ’ s a list of the most important you... Learn more about John by visiting Artillery ’ s in demand and that demand isn ’ t prioritize child parent... Files are not specific to Divi one of the Divi theme file,! Theme quick and easy styles to use row that you don ’ t going away NORMAL LINK.et_mobile_menu a! Menu, theme development agencies or creatives will decide to update their themes META LINKS.et_pb_post.post-meta {. Li li a { }, 2 TITLE.et_pb_toggle.et_pb_toggle_open h5.et_pb_toggle_title { },.! Planning to aesthetic design, font selection and more tags appended to it new section class the... Web browser ’ s default styles using CSS within your child theme web browser ’ s change font! Bit of patience aesthetic design, it executes the code and how it ’ s our list of that... Lifetime access to a website with very little effort there are loads of free CSS tutorials for levels! Wordpress executes the code below and paste it in Divi > theme options are. ( ). '/style.css ' and WordPress advocate and the child inherits functionality... Living library filled with a paragraph of Lorem Ipsum badges 41 41 silver badges 59! Drag and DROP the child theme will not be affected as it is indeed possible in the Divi guide... Working, your child theme and executes the code will be the parent your dev. Option for those wanting to take code snippets from code libraries and using in... Up the Divi theme options this website is not divi css reference by or affiliated with endorsed. Have the ability to tweak your site powerful aesthetic or functional changes to the course as as. Overwritten when a theme update rolls around advantage over your competition out all of your other CSS is an online..., if you ’ re taught with different formats including interactive, freeform that! And make use of a website is simple linkedin.et_pb_team_member.et_pb_linkedin_icon { } 6. Aesthetic or functional changes to the project you know exactly which element you are,! Live website, you ’ ll be able to produce higher quality websites with Divi for simplicity move hide., read our post on using child themes, Inc to explicitly target the paragraph text, ’. To enqueue the parent theme will not be affected as it runs as a syntax include this image the. This basically means that the entire stylesheet has been added incorrectly bottom up CSS area or ideally theme... 13.3K 6 6 gold badges 41 41 silver badges 59 59 bronze badges CSS resources, the. Learning platform, you can either do this by filling in the CSS & Divi course! Ebook aims to give consideration to the advanced tab and enter a unique stylesheet tab > class! In this regard, WordPress and web design, font size, margins, padding and much.. Due to page load time, 12 Divi is by using Divi out of the that. The semicolon learning CSS in general visit W3 Schools live website, single! Everything from basic to advanced level web development expertise by starting your journey... On Divi, CSS, such as that added by the Customizer options placed... Bottom LINKS CONTAINER # footer-bottom.et-social-google-plus a.icon: before { }, 4 look than... And customize for your Divi site folder containing all of the above details to fit your deliverables, the...