not able to edit my style.css file

Do you have a link to the site? Are you sure you’re changing the proper style? Sometimes there will be multiple styles applied to the same element, so you have to find the one that has the most precedence and change that one to get the changes to show.

Hi, Thanks for responding. Its possible I didn’t change the right one. I copied the whole sidebar code below and it is alot. Where I tried to change it is the first set below where it says background-color and then if you skip a paragraph, it says main side bar, I tried to change it there as well. It looks grey to me now, but I wanted it blue, #6699CC but ideally, I want to try many colors to see which one I like the best, just can’t seem to get past this step here!!
Here is the site. https://thecrystalshop.us/
Thanks for any help!
C L

/* Sidebar */

#main .sidebar ul {
list-style-type: none;
margin: 0px;
padding: 0px;
margin-bottom: 15px;
}background-color: #3333FF;

#main .sidebar ul li {
list-style-type: square;
list-style-image:url(imgs/li_bullet1.gif);
padding-left: 3px;
padding-right: 0px;
font-size: 1.15em;
line-height: 100%;
padding-top: 4px;
padding-bottom: 4px;
margin-bottom: 2px;
margin-top: 0px;
margin-left: 25px;
}

#main .sidebar ul li.current-cat {
/* background-color: #3333FF; */}

#main .sidebar ul li ul {
margin: 0px;
padding: 0px;
}

#main .sidebar ul li ul li {
list-style-type: none;
font-size: 11px;
line-height: 100%;
padding-top: 4px;
padding-bottom: 4px;
margin-left: 13px;
margin-bottom: 2px;
margin-top: 2px;
}

#main .sidebar h3 {
font-size: 1.25em;
color: #232323;
margin: 0px;
padding: 0px;
border-bottom: 1px solid #555555;
margin-bottom: 5px;
font-weight: normal;
padding-bottom: 4px;
}

#main .sidebar .search {
border: 1px solid #bbbbbb;
padding: 3px;
font-size: .975em;
width: 225px;
background-color: #f9f9f9;
margin-bottom: 20px;
-moz-border-radius-topleft: 4px;
-moz-border-radius-topright: 4px;
-moz-border-radius-bottomleft: 4px;
-moz-border-radius-bottomright: 4px;
}

#main .sidebar .search .postform {
font-size: 1.1em;
width: 200px;
background-color: #f9f9f9;
margin: 0px;
padding: 0px;
border: 0px;
vertical-align: middle;
}

#main .sidebar .search .postimg {
vertical-align: middle;
border-left: 1px solid #e2e2e2;
}

#main .sidebar .promopic {
text-align: center;
}

#main .sidebar .promopic img {
max-width: 270px;
}

/* Content -> Sidebar Widget Styles */

#main .sidebar .widgetcase {
list-style-type: none;
}
#main .sidebar .widgetcase p {
font-size: .850em;
color: #343434;
line-height: 175%;
}
#main .sidebar .widgetcase .textwidget {
font-size: .850em;
color: #343434;
line-height: 175%;
}
#main .sidebar .widgetcase h2.widgettitle {
border-bottom-color:#555555;
border-bottom-style:solid;
border-bottom-width:1px;
color:#232323;
font-size:1.25em;
font-weight:normal;
margin-bottom:5px;
margin-left:0;
margin-right:0;
margin-top:0;
padding-bottom:4px;
padding-left:0;
padding-right:0;
padding-top:0;
}
#main .sidebar .widgetcase ul {
}
#main .sidebar .widgetcase ul li {
margin-bottom: 3px;
}
#main .sidebar .widgetcase ul li a {
font-size: 12px;
}
#main .sidebar .widgetcase ul li a:hover {
}
#main .sidebar .widgetcase ul .children {
margin-left: 20px;
margin-bottom: 0px;
font-size: 1em;
line-height: normal;
}
/* Other Common Elements */

I’m with dkotter, the problem isn’t with your ability to edit the style.css document, since you can see the changes reflected there, it’s with how you added this change to the file.

My guess is that the change you are making is either not written correctly (in CSS) and thus not recognized, or is being overridden by another declaration on the same style sheet. I wouldn’t mess with file permissions on the server, as that is not the issue in this case.

First thing I’d check, make sure there is a semicolon (;) at the end of the line – that one gets me every once in a while, even as an experienced designer. :/

Cheers

Change the first declaration to this:

#main .sidebar ul {
list-style-type: none;
margin: 0px;
padding: 0px;
margin-bottom: 15px;
background-color: #3333FF;
}

The bracket has to come after all the style declarations for #main .sidebar, typically after the last semicolon.

Thanks, I did try this, but it still looks the same. I am getting the feeling I can put anything in there and it will still look the same! ??

Okay the issue you’re having is there is an image that is being used as the background color. So this image overrides any background color style you put in. So to fix this, you’d have to get rid of that background image.

That style is found in you mkt_style.css file on/or around line 32. It looks like this:

#main {
   background-image: url(page_bg.jpg);
}

You’ll need to delete this to stop that image from overriding everything else.

And then to color the sidebar, add this declaration to custom_style_base.css around line 183 (everything but the background property is already there, so just add the background):

#main .sidebar {
   width: 270px;
   float: left;
   padding-top: 25px;
   padding-right: 15px;
   padding-left: 15px;
   padding-bottom: 20px;
   background: #69C;
}

Then change the color to whatever you want. Let me know if you need anymore help.

Ok that worked! thank you! Look at it now: https://thecrystalshop.us/

See where it put the blue? There is still that grey background in there behind the blue on the side bar. do you see code in there that I can remove to change the grey part?
thanks so much for your help! ??

Okay you added the blue color to the #main .sidebar ul declaration. You need to add it to the #main .sidebar and then it will show up on the entire sidebar.

Ok got it! Thank you, you are brilliant!! ?? Now I can play with it a bit and get the colors I want.
I learned a lot today thanks to you!