Is it possible to remove the dot before each of these fields using CSS? I cannot seem to find the ability to do so. thanks!
http://www.inksharks.com/kbca-registration/
There's a background image added to each li element. You have to remove it by adding the following CSS
ul > li, .dark-icons ul > li {
background-image: none;
}
you may try
.gform_body ul li{list-style:none;}
if above code does not work then
.gform_body ul li{list-style:none !important;}
Related
I want to change the color of the parent and the sub parent category into two different colours. Currently using the following code for my widget side tab.
.widget ul {background: gray;padding-top: 1px;}
.widget ul li {background:lightgray;margin: 1px;}
.widget ul a{background-color:darkgray;padding:1px;}
looking to change the font colour. I have tried many options but still not getting it right.
Try this:
.widget ul li.parent > a {
color: red !important;
}
It's hard to say without seeing your HTML structure, but are each of the sub-parent links ('Access Control', 'Electronic locks', etc) their own ul tags?
If so, could you not target each of their first li's like this:
.widget ul > li:first-of-type > a {
color: red;
/* INSERT STYLES */
}
This would target all uls' first li > a elements, as in the image on the right.
I want to remove(hide) bullets (dots) with css code, but I can`t
Please tell me what I do wrong:
1) I give class name in my case: .no-bullets
2) I use this css code:
.no-bullets {
list-style-type: none;
}
this is not working for me...
Then I use this css in theme stylesheet:
ul
{
list-style-type: none !important;
}
again nothing...
Please help me with this, thank you in advance
here is my suggestion:
ul {
list-style: none;}
the list-style properties apply to elements with display: list-item only ,make sure your list elements doesnt have any other display style.UPDATE
seeing your link your style.css file is overriding your custom style with list-style-type: disc; you have to get rid of this line.
UPDATE 2use this code in your custom css .entry-content ul > li {
list-style-type: none !important;
}
this will do the job quickly.
I have been trying to remove the bullet and indent from a < ul> element for quite a while now and I just can't figure out how - or rather why it's not working.
There are several solutions here on overflow, however none of them is working for me.
this should work(?) but it doesn't:
.widget li {list-style: none; } or:
.widget li {list-style-type: none; } (!important does not help)
here is the link to the page with the problem and a picture of the location I mean: any ideas? thanks!
http://wuttke-klima.witconsult.de/neue-firmenzentrale-der-fam-magdeburg/
that arrow is displaying from a :before just display:none it
Remove the left padding to remove padding on li
.arpw-ul li:before { display: none; }
.arpw-ul li { padding-left : 0 }
TIP : Just use google chromes inspect element to test these kind of things. just live results
Looks like you have a pseudo-element that creates the arrow bullet. You should be able to remove it with:
.footer-widget li:before, .widget li:before {
border: none;
}
If that is really a bullet (seems like it is not) then this shall help:
.widget li { display:block; }
But I suspect it is not a bullet but something else (like ::before pseudo element). Use DOM/style inspector tool in your browser.
Try this:
ul {
list-style-type: none;
}
For some reason my css is acting weirdly on pages that are not the index.
Which is weird because the whole top part of the webpage is a shared include between all of them.
Here is a pic of the problem and the relevant code:
Top part of pages: http://pastebin.com/qePqZhsE
navbar.php: http://pastebin.com/7065Dxcy
Css for navbar: http://pastebin.com/79tdQ4eP
It has to be something in the CSS, because the rest is identical but I don't see it. (though I might just be lacking too much sleep :P)
Replace
ul.dropdown li.hover a { color: red; }
with
ul.dropdown li:hover a { color: red; }
on line 12 in css file
EDIT:
As said in the comment below, You have a structure like this: "ul.dropdown > li > ul > li > a" qhile you are applying css to "ul.dropdown li a".
So, try replacing
ul.dropdown li.hover a
with
ul.dropdown > li > ul > li.hover a
or remove at all.
Simply, the issue is that the navbar's structure in your PHPs other than index is different, here's a screenshot of the structure of your navbar in index.php:
In empty.php:
Just make sure you're using the same structure, I guess; hope that helped!
I'm trying to make a nice-looking CSS menu, for this website. (The domain is just a sandbox, not the actual website I intend to use the designed pages on!)
As you may be able to see, there is a CSS menu at the top. When you hover over one of the sections, it drops down all nicely, but the sub-menu text is staying black, instead of the #CCC (grey) colour that I wanted -I need black for the hover font colour, for aesthetic reasons. I checked out the current CSS styles in the Inspector part of Google Chrome (F12), and the #CCC part of the section has been crossed out. From what I understand, that means it's been overidden, but I don't know what by...
If anyone has a similar code feature in their browser, I would really appreciate it if you could check it out. I made the menu all by myself, so I'd like to think I can code, but I just can't understand what's overiding the font colour.. I think it's line 73 of the new_menu_style.css file.
You should try adding this to the CSS:
.menu ul li:hover ul li a {
color: #ccc;
}
.menu ul li:hover ul li a:hover {
color: black;
}
The .menu ul li:hover a gets a higher weight than the other one, overriding it.
First: Do something about your code style. proper indentation makes a great effort to increase readability:
So here is a solution: add this to your css as these override the .menu ul li:hover a
.menu ul li:hover ul a {
color:#ccc
}
.menu ul li:hover ul li:hover a {
color:#000
}