• 0

CSS Range Control: Color thumb diff for each


Go to solution Solved by SinsOfCube,

Question

James Rose

Hello gang,

 

I need to be able to have a few Range controls, and each one needs to have it's thumb a different color.  I have just spent a good chunk of time on Codepen, etc attempting to find an answer.

 

This css works for all Range controls...  but obviously I need to have a separate class for each... what dumb@$$ thing am I missing?

 

The image shows what I am attempting to accomplish.

 

Thanks.

input[type='range']::-moz-range-thumb {
	 -moz-appearance: none;
	 border-radius: 20px;
	 background-color: #FFF;
	 box-shadow:
		inset 0 0 16px #B2B200,
		inset 16px 0 20px #FFFF33;
	 border: 2px solid #292908;
	 height: 20px;
	 width: 20px;
}

post-45653-0-04002400-1400518338.png

Link to post
Share on other sites

11 answers to this question

Recommended Posts

  • 0
SinsOfCube

Just use a class to define the thumb attributes and seperate classes for the colours and give the range input elements the colourclass.

input[type='range']::-moz-range-thumb {
     -moz-appearance: none;
     border-radius: 20px;
     background-color: #FFF;
     border: 2px solid #292908;
     height: 20px;
     width: 20px;
}
input[type='range'].yellow::-moz-range-thumb {
     box-shadow:
          inset 0 0 16px #B2B200,
          inset 16px 0 20px #FFFF33;
}
input[type='range'].red::-moz-range-thumb {
     box-shadow:
          inset 0 0 16px #FF0000,
          inset 16px 0 20px #FFFF33;
}
<input type="range" class="yellow"/>
<input type="range" class="red"/>

etc.

Link to post
Share on other sites
  • 0
winlonghorn

 

Hello gang,

 

I need to be able to have a few Range controls, and each one needs to have it's thumb a different color.  I have just spent a good chunk of time on Codepen, etc attempting to find an answer.

 

This css works for all Range controls...  but obviously I need to have a separate class for each... what dumb@$$ thing am I missing?

 

The image shows what I am attempting to accomplish.

 

Thanks.

input[type='range']::-moz-range-thumb {
	 -moz-appearance: none;
	 border-radius: 20px;
	 background-color: #FFF;
	 box-shadow:
		inset 0 0 16px #B2B200,
		inset 16px 0 20px #FFFF33;
	 border: 2px solid #292908;
	 height: 20px;
	 width: 20px;
}

 

try input[type=range]::-moz-slider-thumb instead of input[type=range]::-moz-range-thumb. 

Link to post
Share on other sites
  • 0
James Rose

Thanks, but that won't change the fact that I need multiple classes to change the thumb color so that each Range can have their own color.  The code I gave works... but it makes all Range objects have the same color.

 

or am I missing the point you are giving?

Link to post
Share on other sites
  • 0
winlonghorn

Thanks, but that won't change the fact that I need multiple classes to change the thumb color so that each Range can have their own color.  The code I gave works... but it makes all Range objects have the same color.

 

or am I missing the point you are giving?

 

No problem! I apologize. I misunderstood what you were trying to achieve. I will look a bit deeper and see if I can't find an answer for you. :)

 

EDIT: I have a quick question. Why try and avoid using multiple classes in this instance? One thing you could do if you don't want to use multiple classes is use ids instead. CSS ids are designed to be used for unique element styling (giving different elements their own unique styling). CSS classes are designed for when you want to use the same styling across multiple elements. 

Link to post
Share on other sites
  • 0
James Rose

EDIT: I have a quick question. Why try and avoid using multiple classes in this instance? One thing you could do if you don't want to use multiple classes is use ids instead. CSS ids are designed to be used for unique element styling (giving different elements their own unique styling). CSS classes are designed for when you want to use the same styling across multiple elements. 

 

I'm open to all ideas, it does not have to be separate classes

Link to post
Share on other sites
  • 0
James Rose

SinsofCube,

 

THANK YOU!  That is exactly what I needed.

 

Have a great day.

Link to post
Share on other sites
  • 0
winlonghorn

I apologize that I wasn't able to be of more help!

Link to post
Share on other sites
  • 0
James Rose

I apologize that I wasn't able to be of more help!

 

No, thank you very much for attempting.  I didn't know the answer, so thank you for taking your time.   Have a great evening

Link to post
Share on other sites
  • 0
winlonghorn

No, thank you very much for attempting.  I didn't know the answer, so thank you for taking your time.   Have a great evening

 

You are very welcome! I understand how it is to search for an answer for what seems like forever and feel completely lost. Therefore, I wanted to at least try and provide an answer because nobody had been able to answer up to that point. :)

Link to post
Share on other sites
  • 0
James Rose

You are very welcome! I understand how it is to search for an answer for what seems like forever and feel completely lost. Therefore, I wanted to at least try and provide an answer because nobody had been able to answer up to that point. :)

 

Indeed.  I have been a professional developer for 20 years, and there is always something we need to learn.   There is simply too much for one person to know...  so we all try to help each other.   It is one of the nice things about being in tech.

Link to post
Share on other sites
  • 0
winlonghorn

Indeed.  I have been a professional developer for 20 years, and there is always something we need to learn.   There is simply too much for one person to know...  so we all try to help each other.   It is one of the nice things about being in tech.

 

I definitely cannot argue about that. :) It is nice to know that there are people there to assist if you get stuck. Thank you! 

Link to post
Share on other sites
This topic is now closed to further replies.
  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By News Staff
      Pay What You Want for this 20-Course Programming Bundle
      by Steven Parker

      Today's highlighted deal comes via our Online Courses section of the Neowin Deals store, where you can Pay What You Want for the The 20-Course Programming Bundle. From game development to making responsive apps, this 20-course collection has everything you need to start coding.



      What's the deal?
      With the Pay What You Want bundles, you can get something incredible for as little as you want to pay. And if you beat the average price, you’ll receive the fully upgraded bundle! Included in this Pay What You Want deal, are the following courses:

      Pay What You Want (as little as $1) for the following course:

      Image Processing with Python: Build an Instagram-Style Filter
      Develop a Photo Filter Editor from Scratch & Master Your Understanding of Matrices, Color Models & More

      Beat the average price to get the following courses as well:

      Azure Deployment for Node.js Applications
      Discover How to Deploy Your Node.js Apps to Microsoft Azure & Make Them Accessible Online

      MongoDB for Beginners
      Get Acquainted with MongoDB & Discover How to Manage Data Operations Like a Pro

      Node.js For Beginners: Create Server-Side Apps with JavaScript
      Learn How to Build Fast Web Applications with Node.js, the Server-Side Solution for JavaScript

      Intro to Next.js
      Get started with the Minimalist Framework That Allows You to Build Static, Server-Rendered React Apps

      Intro to Bootstrap
      Learn Bootstrap, the Secret to Quickly Creating Professional & Attractive Websites + Web Apps

      Create Interactive Pages with Javascript & the DOM API
      Explore the DOM API, HTML5 & Advanced JavaScript Concepts by Building Three Projects

      JavaScript Programming: Learn by Making a Mobile Game
      Dive into JavaScript's Core Concepts By Building a Game From Scratch

      HTML & CSS Course
      Learn HTML & CSS from Scratch by Creating a Responsive Landing Page

      AWS Deployment for Node.js Applications
      Discover How to Deploy Your Node.js Apps to AWS & Make Them Accessible Online

      The Complete HTML5 Mobile Game Development Course
      Use the Phaser HTML5 Framework & JavaScript Technologies to Build Cross-Platform Games

      Master Unity Game Development: Beginner's Bootcamp
      Learn Unity & C# by Creating a 3D Multi-Level Platformer Game

      Master Unity Mobile Game Development
      Learn the Quirks of Mobile Game Development with Unity

      Unity Game Development: Build a First-Person Shooter
      Master Unity by Building Your Own Version of Doom or Call of Duty

      Data Manipulation with Pandas
      Learn How to Read & Manipulate Data + Prepare It for Analysis Using the Pandas Library

      The Complete Python Data Visualization Course
      Master the Major Plotting Libraries Matplotlib, Seaborn & Bokeh + Use Them to Create Beautiful Plots

      Learn Python 3 by Making a Game
      Get up to Speed with Python by Creating Your Very Own Game

      Build a Tower Defense Game with Phaser 3
      Master the Skills Needed to Build a Complete Tower Defense Game Using Phaser 3

      Numpy Matrices & Vectors
      Take Advantage of the Numpy Library & Build Powerful + Functional Arrays and Matrices

      The Complete Responsive Web Design Course
      Learn How to Build Professional Websites That Work Across Different Devices & Platforms

      Good to know
      Certification of completion included Length of time users can access this course: lifetime Redemption deadline: redeem your code within 30 days of purchase Here's the deal:
      The bundle represents an overall retail value of $3,732 But you can Pay What You Want for the unlocked courses (as little as $1) Beat the average price and you'll take home the entire bundle. Qualify for the giveaway!
      Beat the Leader's price and get entered into the epic giveaway—plus get featured on the leaderboard!

      >> Pay What You Want for The 20-Course Programming Bundle <<
      See other Pay What You Want deals. This is a time-limited offer that ends soon.
      Get $1 credit for every $25 spent · Give $10, Get $10 · 10% off for first-time buyers.

      Not for you?
      That's OK, there are other deals on offer you can check out here.



      Home Gym Giveaway | Ultimate Gaming Giveaway (feat. PlayStation 5 & Xbox Series X) Ivacy VPN - 5 year subscription for just $1 per month NordVPN - 2 year subscription at up to 68% off Private Internet Access VPN - subscriptions at up to 71% off Unlocator VPN or SmartDNS - unblock Geoblock with 7-day free trial Neowin Store for our preferred partners. Subscribe to Neowin - for $14 a year, or $28 a year for Ad-Free experience Disable Sponsored posts · Neowin Deals · Free eBooks · Neowin Store

      Disclosure: This is a StackCommerce deal or giveaway in partnership with Neowin; an account at StackCommerce is required to participate in any deals or giveaways. For a full description of StackCommerce's privacy guidelines, go here. Neowin benefits from shared revenue of each sale made through our branded deals site, and it all goes toward the running costs.

    • By News Staff
      Save 98% off this 2021 Premium Learn to Code Certification Bundle
      by Steven Parker

      Today's highlighted deal comes via our Online Courses section of the Neowin Deals store, where for only a limited time, you can save 98% off this Premium Learn to Code 2021 Certification Bundle. Amp up your programming skill set with 270+ hours of content on the leading coding languages — taught by top-rated instructors Ft. Rob Percival, Nick Walter, and more!.



      This deal consists of the following courses:

      JavaScript Beginner Bootcamp
      Understand the JavaScript Language & Learn to Create and Launch Interactive Webpages SwiftUI Apps for All Apple Platforms
      Learn the True Magic of SwiftUI & Make Apps and Widgets for iPhone, Mac, iPad, Apple Watch, and AppleTV The Complete C# Programming Course
      Master C# & .NET Framework with Code Challenges, Exercises, & Real-Life Examples The Complete Web Developer Course 2.0
      Learn By Doing: Build 25 Websites & Mobile Apps Alongside Top-Rated Online Coding Instructor, Rob Percival! SwiftUI: The Complete Developer Course
      Learn Everything You Need to Know About the SwiftUI Framework & Leverage All of Its Great New Technologies 2020 Complete Ruby on Rails 6 Bootcamp
      Start From the Basics of Ruby on Rails & Go All the Way to Creating Your Own Applications Learn Python for Data Analysis & Visualization
      Gear Yourself with Necessary Skills for Expert-Proven Data Science Techniques Raspberry Pi Essentials & Extras
      Broaden Your Raspberry Pi's Horizons with This 1-Hour Crash Course PHP & MySQL: Certification Course for Beginners
      Learn to Build Database-Driven Web Applications Using PHP & MySQL Bootstrap & jQuery: Certification Course for Beginners
      Create Fully Animated, Interactive, Mobile Responsive Web Pages Using Bootstrap & jQuery Library HTML, CSS, & JavaScript: Certification Course for Beginners
      A Comprehensive Guide for Beginners Interested in Learning HTML, CSS, & JavaScript to Build Interactive Web Pages Java Foundations
      Master the General Purpose & Object-Oriented Language of Java to Enhance Your Skills for Mobile Development Making APIs with Django & Python
      Use the REST Framework to Quickly Make APIs for Your Django Projects Making Websites with Python & Django 3: The Ultimate Beginner's Guide
      Boot Up the Django 3 Web Framework Written In Python & Develop Websites Fast JavaScript Master Class
      A Comprehensive Course Just About Every Fact on JavaScript You Could Ever Hope to Know Python for Everyone
      Learn the Basic Syntax of How Python Language Works How to Get a Job as a Web Developer
      Tips, Tricks & Industry Secrets to Help You Land That Web Development Job The Python Mega Course: Build 10 Real World Applications
      A Complete Practical Python Course for Beginners & Intermediates! Master Python 3 by Building Actual Python Apps ROS2 For Beginners
      Master the Key ROS Concepts to Create Powerful & Scalable Robot Applications The Complete Web Developer Course: Build 20 Websites
      Learn the Fundamentals of HTML, CSS & JavaScript by Building 20 Real-World Websites Machine Learning for Absolute Beginners
      Learn to Build Machine Learning Models Using Spreadsheet Data Java Interview Questions: Data Structures & Algorithms
      The Best Java Interview Guide with the Most Common Beginner Questions Asked by FANG Companies

      The Ultimate Amazon Honeycode Guide: Build 7 Apps
      Build Apps to Automate Data Entry: Make Inventory Management Apps & More Easy Business Projects

      Learn Flutter & Dart: Complete App Development Projects
      Build Apps in Flutter, Google's Cross-Platform Framework & Code with Its Dart Programming Language

      Complete Data Science Training with Python for Data Analysis
      Learn Statistics, Visualization, Machine Learning & More

      C++ Programming for Beginners
      Master C++, An In-Demand, High-End Language Used for Programs, Games, Development Libraries, & More

      The Complete Front-End Web Development Course
      Take a Hands-on Approach to Learning Real Programming Skills

      Good to know
      Certification of completion included Length of time users can access this course: lifetime Redemption deadline: redeem your code within 30 days of purchase For a full description, specs, and instructor info, click here.

      Here's the deal:
      This Premium Learn to Code 2021 Certification Bundle normally costs* $4,056, but you can pick it up for just $59.99 for a limited time - that represents a saving of $3,996.01 (98%) off.

      Get this deal, or learn more about it
      See all discounted Online Courses. This is a time-limited offer.
      Get $1 credit for every $25 spent · Give $10, Get $10 · 10% off for first-time buyers.

      Not for you?
      If this offer doesn't interest you, why not check out the following offers:



      The Win Your Dream 2020 Tesla Model 3 Giveaway Ivacy VPN - 5 year subscription for just $0.99 per month NordVPN - 2 year subscription at up to 68% off +3 months for free! Private Internet Access VPN - subscriptions at up to 71% off Unlocator VPN or SmartDNS - unblock Geoblock with 7-day free trial Subscribe to Neowin - for $14 a year, or $28 a year for Ad-Free experience Disable Sponsored posts · Neowin Deals · Free eBooks · Neowin Store

      Disclosure: This is a StackCommerce deal or giveaway in partnership with Neowin; an account at StackCommerce is required to participate in any deals or giveaways. For a full description of StackCommerce's privacy guidelines, go here. Neowin benefits from shared revenue of each sale made through our branded deals site, and it all goes toward the running costs.

    • By News Staff
      Save almost $4K off this 2021 Premium Learn to Code Certification Bundle
      by Steven Parker

      Today's highlighted deal comes via our Online Courses section of the Neowin Deals store, where for only a limited time, you can save 98% off this Premium Learn to Code 2021 Certification Bundle. Amp up your programming skill set with 270+ hours of content on the leading coding languages — taught by top-rated instructors Ft. Rob Percival, Nick Walter, and more!.



      This deal consists of the following courses:

      JavaScript Beginner Bootcamp
      Understand the JavaScript Language & Learn to Create and Launch Interactive Webpages SwiftUI Apps for All Apple Platforms
      Learn the True Magic of SwiftUI & Make Apps and Widgets for iPhone, Mac, iPad, Apple Watch, and AppleTV The Complete C# Programming Course
      Master C# & .NET Framework with Code Challenges, Exercises, & Real-Life Examples The Complete Web Developer Course 2.0
      Learn By Doing: Build 25 Websites & Mobile Apps Alongside Top-Rated Online Coding Instructor, Rob Percival! SwiftUI: The Complete Developer Course
      Learn Everything You Need to Know About the SwiftUI Framework & Leverage All of Its Great New Technologies 2020 Complete Ruby on Rails 6 Bootcamp
      Start From the Basics of Ruby on Rails & Go All the Way to Creating Your Own Applications Learn Python for Data Analysis & Visualization
      Gear Yourself with Necessary Skills for Expert-Proven Data Science Techniques Raspberry Pi Essentials & Extras
      Broaden Your Raspberry Pi's Horizons with This 1-Hour Crash Course PHP & MySQL: Certification Course for Beginners
      Learn to Build Database-Driven Web Applications Using PHP & MySQL Bootstrap & jQuery: Certification Course for Beginners
      Create Fully Animated, Interactive, Mobile Responsive Web Pages Using Bootstrap & jQuery Library HTML, CSS, & JavaScript: Certification Course for Beginners
      A Comprehensive Guide for Beginners Interested in Learning HTML, CSS, & JavaScript to Build Interactive Web Pages Java Foundations
      Master the General Purpose & Object-Oriented Language of Java to Enhance Your Skills for Mobile Development Making APIs with Django & Python
      Use the REST Framework to Quickly Make APIs for Your Django Projects Making Websites with Python & Django 3: The Ultimate Beginner's Guide
      Boot Up the Django 3 Web Framework Written In Python & Develop Websites Fast JavaScript Master Class
      A Comprehensive Course Just About Every Fact on JavaScript You Could Ever Hope to Know Python for Everyone
      Learn the Basic Syntax of How Python Language Works How to Get a Job as a Web Developer
      Tips, Tricks & Industry Secrets to Help You Land That Web Development Job The Python Mega Course: Build 10 Real World Applications
      A Complete Practical Python Course for Beginners & Intermediates! Master Python 3 by Building Actual Python Apps ROS2 For Beginners
      Master the Key ROS Concepts to Create Powerful & Scalable Robot Applications The Complete Web Developer Course: Build 20 Websites
      Learn the Fundamentals of HTML, CSS & JavaScript by Building 20 Real-World Websites Machine Learning for Absolute Beginners
      Learn to Build Machine Learning Models Using Spreadsheet Data Java Interview Questions: Data Structures & Algorithms
      The Best Java Interview Guide with the Most Common Beginner Questions Asked by FANG Companies

      The Ultimate Amazon Honeycode Guide: Build 7 Apps
      Build Apps to Automate Data Entry: Make Inventory Management Apps & More Easy Business Projects

      Learn Flutter & Dart: Complete App Development Projects
      Build Apps in Flutter, Google's Cross-Platform Framework & Code with Its Dart Programming Language

      Complete Data Science Training with Python for Data Analysis
      Learn Statistics, Visualization, Machine Learning & More

      C++ Programming for Beginners
      Master C++, An In-Demand, High-End Language Used for Programs, Games, Development Libraries, & More

      The Complete Front-End Web Development Course
      Take a Hands-on Approach to Learning Real Programming Skills

      Good to know
      Certification of completion included Length of time users can access this course: lifetime Redemption deadline: redeem your code within 30 days of purchase For a full description, specs, and instructor info, click here.

      Here's the deal:
      This Premium Learn to Code 2021 Certification Bundle normally costs* $4,056, but you can pick it up for just $59.99 for a limited time - that represents a saving of $3,996.01 (98%) off.

      >> Get this deal, or learn more about it <<
      See all discounted Online Courses. This is a time-limited offer.
      Get $1 credit for every $25 spent · Give $10, Get $10 · 10% off for first-time buyers.

      Not for you?
      If this offer doesn't interest you, why not check out the following offers:



      The Win Your Dream 2020 Tesla Model 3 Giveaway Ivacy VPN - 5 year subscription for just $0.99 per month NordVPN - 2 year subscription at up to 68% off +3 months for free! Private Internet Access VPN - subscriptions at up to 71% off Unlocator VPN or SmartDNS - unblock Geoblock with 7-day free trial Subscribe to Neowin - for $14 a year, or $28 a year for Ad-Free experience Disable Sponsored posts · Neowin Deals · Free eBooks · Neowin Store

      Disclosure: This is a StackCommerce deal or giveaway in partnership with Neowin; an account at StackCommerce is required to participate in any deals or giveaways. For a full description of StackCommerce's privacy guidelines, go here. Neowin benefits from shared revenue of each sale made through our branded deals site, and it all goes toward the running costs.

    • By News Staff
      Save 98% off this 2021 Premium Learn to Code Certification Bundle
      by Steven Parker

      Today's highlighted deal comes via our Online Courses section of the Neowin Deals store, where for only a limited time, you can save 98% off this Premium Learn to Code 2021 Certification Bundle. Amp up your programming skill set with 270+ hours of content on the leading coding languages — taught by top-rated instructors Ft. Rob Percival, Nick Walter, and more!.



      This deal consists of the following courses:

      JavaScript Beginner Bootcamp
      Understand the JavaScript Language & Learn to Create and Launch Interactive Webpages SwiftUI Apps for All Apple Platforms
      Learn the True Magic of SwiftUI & Make Apps and Widgets for iPhone, Mac, iPad, Apple Watch, and AppleTV The Complete C# Programming Course
      Master C# & .NET Framework with Code Challenges, Exercises, & Real-Life Examples The Complete Web Developer Course 2.0
      Learn By Doing: Build 25 Websites & Mobile Apps Alongside Top-Rated Online Coding Instructor, Rob Percival! SwiftUI: The Complete Developer Course
      Learn Everything You Need to Know About the SwiftUI Framework & Leverage All of Its Great New Technologies 2020 Complete Ruby on Rails 6 Bootcamp
      Start From the Basics of Ruby on Rails & Go All the Way to Creating Your Own Applications Learn Python for Data Analysis & Visualization
      Gear Yourself with Necessary Skills for Expert-Proven Data Science Techniques Raspberry Pi Essentials & Extras
      Broaden Your Raspberry Pi's Horizons with This 1-Hour Crash Course PHP & MySQL: Certification Course for Beginners
      Learn to Build Database-Driven Web Applications Using PHP & MySQL Bootstrap & jQuery: Certification Course for Beginners
      Create Fully Animated, Interactive, Mobile Responsive Web Pages Using Bootstrap & jQuery Library HTML, CSS, & JavaScript: Certification Course for Beginners
      A Comprehensive Guide for Beginners Interested in Learning HTML, CSS, & JavaScript to Build Interactive Web Pages Java Foundations
      Master the General Purpose & Object-Oriented Language of Java to Enhance Your Skills for Mobile Development Making APIs with Django & Python
      Use the REST Framework to Quickly Make APIs for Your Django Projects Making Websites with Python & Django 3: The Ultimate Beginner's Guide
      Boot Up the Django 3 Web Framework Written In Python & Develop Websites Fast JavaScript Master Class
      A Comprehensive Course Just About Every Fact on JavaScript You Could Ever Hope to Know Python for Everyone
      Learn the Basic Syntax of How Python Language Works How to Get a Job as a Web Developer
      Tips, Tricks & Industry Secrets to Help You Land That Web Development Job The Python Mega Course: Build 10 Real World Applications
      A Complete Practical Python Course for Beginners & Intermediates! Master Python 3 by Building Actual Python Apps ROS2 For Beginners
      Master the Key ROS Concepts to Create Powerful & Scalable Robot Applications The Complete Web Developer Course: Build 20 Websites
      Learn the Fundamentals of HTML, CSS & JavaScript by Building 20 Real-World Websites Machine Learning for Absolute Beginners
      Learn to Build Machine Learning Models Using Spreadsheet Data Java Interview Questions: Data Structures & Algorithms
      The Best Java Interview Guide with the Most Common Beginner Questions Asked by FANG Companies

      The Ultimate Amazon Honeycode Guide: Build 7 Apps
      Build Apps to Automate Data Entry: Make Inventory Management Apps & More Easy Business Projects

      Learn Flutter & Dart: Complete App Development Projects
      Build Apps in Flutter, Google's Cross-Platform Framework & Code with Its Dart Programming Language

      Complete Data Science Training with Python for Data Analysis
      Learn Statistics, Visualization, Machine Learning & More

      C++ Programming for Beginners
      Master C++, An In-Demand, High-End Language Used for Programs, Games, Development Libraries, & More

      The Complete Front-End Web Development Course
      Take a Hands-on Approach to Learning Real Programming Skills

      Good to know
      Certification of completion included Length of time users can access this course: lifetime Redemption deadline: redeem your code within 30 days of purchase For a full description, specs, and instructor info, click here.

      Here's the deal:
      This Premium Learn to Code 2021 Certification Bundle normally costs* $4,056, but you can pick it up for just $59.99 for a limited time - that represents a saving of $3,996.01 (98%) off.

      >> Get this deal, or learn more about it <<
      See all discounted Online Courses. This is a time-limited offer.
      Get $1 credit for every $25 spent · Give $10, Get $10 · 10% off for first-time buyers.

      Not for you?
      If this offer doesn't interest you, why not check out the following offers:



      The Win Your Dream 2020 Tesla Model 3 Giveaway Ivacy VPN - 5 year subscription for just $0.99 per month NordVPN - 2 year subscription at up to 68% off +3 months for free! Private Internet Access VPN - subscriptions at up to 71% off Unlocator VPN or SmartDNS - unblock Geoblock with 7-day free trial Subscribe to Neowin - for $14 a year, or $28 a year for Ad-Free experience Disable Sponsored posts · Neowin Deals · Free eBooks · Neowin Store

      Disclosure: This is a StackCommerce deal or giveaway in partnership with Neowin; an account at StackCommerce is required to participate in any deals or giveaways. For a full description of StackCommerce's privacy guidelines, go here. Neowin benefits from shared revenue of each sale made through our branded deals site, and it all goes toward the running costs.

    • By Brian Miller
      Does anyone know how to wrap/arc a  <DIV>  around a circle, as in this example?
       

       
       
      Here's my initial code...
       
      <div id="RainbowArch" style="background-image: linear-gradient(270deg, #FF0000 0%, #FFF200 21%, #1BE006 48%, #00F6FF 77%, #0098FF 100%); border: 1px solid #979797; Height: 32px; width: 400px"></div> <div id="GreyCircle" style="background: #DCDBDB; border: 1px solid #979797; solid #979797; Height: 400px; width: 400px; border-radius:50%"></div>