Box bulleted items showing up how do you remove them?

HTML & CSS
1

I have a webpage http://www.yourdollarhost.com/test.html

How do I get rid of the bulleted circles under “Domain & Free Hosting Plan” and “Reseller Hosting Plan”

Thanks!

2

Try searching for “CSS list-style-property”

3

Wanna know why it doesn’t affect the first one?

.list-checkmark, .myunstyled, .inline-right, .inline-left, .blocked-links, .social, .pricing table ul {
background: none;
list-style-type: none;
margin: 0;
padding: 0;
}

You give the pricing table ul no list-style. However you do not do that for the pricing2 or pricing3 table ul. Add those rules in.

4

That worked but the bottom buttons “Order Now With PayPal” and “Order Now With Cheque” on Reseller Hosting Plan expanded to double text.

http://www.yourdollarhost.com/test.html

Thank you!

5

Adding the rules we said affected those buttons…? Two test pages please - one without the code you just had (so revert the changes.)

The .bigbtn class just has too much padding. 40px left and right padding?! Are you just trying to horizontally center it? You don’t need to mess with horizontal padding.

Remove the horizontal padding and just give it display:block so it takes up the available width.

6

Whats the CSS code for that?

Thanks!

7 
.bigbtn
{
  padding:18px 0;
  display:block;
}

You’ll want the same with the pricing2 mybtn and the pricing mybtn.

8

Before I altered the code: http://www.yourdollarhost.com/test2.html
After I altered the code: http://www.yourdollarhost.com/test.html

It worked but it minimized the boxes to only the text as you can see on test.html.

Thanks!

9

You didn’t do as I said. Please revisit my above post and do it over.

10

That worked, one more question. How do I change the color of the blue circle that says “$13.50/year” and blue circle that says “$2.70/year” to a different color?

Thanks!

11

In your HTML add a class to the each one you want to change. Perhaps add a class called “green”. So your HTML class should look like this: class=“price-label green”.

Then in your .green{} CSS, apply a new background color.

If you want the 3rd one to be a different color, add a different class to that one in the HTML and update the CSS background color for that new class accordingly.

12

That’s complicated any code to make that work?

Thanks!

13

Wheres the blue code thats making it that color maybe I can just figured it out from that?

Thanks!

14

.price-label{} background color.

Unless you want duplicates of it (.price-label2/3{}) and a different background color there, do my suggestion.

It’s not complicated at all. Throw on a class and give it a background color. Could not be more simple :slight_smile: .

15

OK on what tag line do I give class=“price-label red” to and what .red{} CSS code would it look like?

Thanks!

16 
.red{background-color:red;}

Or

.price-label.red{background-color:red;}

Your call. The second will only give background-color:red to elements with both classes.

17

Where do I put the class=“price-label red” code in my HTML?

Thanks!

18

That worked. Thank you for the help.

19

All good?

20

all good