WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] CSS - Removing image border ALSO removes input box border. Unlink? (10 posts)

  1. sharris203
    Member
    Posted 4 years ago #

    I'm using Fresh News Woo theme. By default all the images have a 1px border. So I changed css to remove them completely.

    However, now ALL of my input boxes (login widget, contact form, etc.) and Submit buttons have no border around them, making them hard to see. So where it says "Username:" just has a blank white space, which may be confusing, instead of a box w/border where you would normally type.

    How to separate things so images and input boxes are not linked?

    Code:

    input{
    	border: none;
    	font-size: 12px;
    	padding: 5px;
    }

    Also, how to change the background color of Submit buttons? (they match closely with the background color of my theme, making them hard to see w/out border)

  2. Dave Redfern
    Member
    Posted 4 years ago #

    images and inputs have no relation in css. make sure it when you deleted the cdd for the image borders it didn't look something similar to this:

    input, img {
    border:1px solid #000;
    }

    if it was like this it was select two types of items - images and input boxes.

    the code you have at the moment has border:none which is your problem. change it to something like:-

    input{
    	border: 1px solid #000;
    	font-size: 12px;
    	padding: 5px;
    }

    to change the background of a submit button you'll need to find out whether it is a input or button. it is more likely to be a input. if it's an input it will need a specific id or class to it. then you can do something like:-

    input#buttonID {
    background:#cc0000;
    }

    hope this helps a bit.

    dave.

  3. esmi
    Forum Moderator
    Posted 4 years ago #

    Try:

    input{
    border: 1px solid #ccc;
    font-size: 12px;
    padding: 5px;
    }
    img {
    border:none;
    }

    how to change the background color of Submit buttons?

    Site url?

  4. sharris203
    Member
    Posted 4 years ago #

    I NEED borders off images, but ON submit buttons.

    I just realized a problem. The images I'm speaking of are actually Add to Cart and Checkout buttons, maybe that's why they are seen as submit type.

    The original code was:

    input{
    	border: #cacaca 1px solid;
    	font-size: 12px;
    	padding: 5px;
    }

    img was never there. I only found through trial and error that setting this border to none took it off the images/buttons.

    Now I have tried:

    input{
    border: 1px solid #ccc;
    font-size: 12px;
    padding: 5px;
    }
    img {
    border:none;
    }

    But the images/buttons got the border around them again.

    URL coming soon.

  5. Peter Boosten
    Member
    Posted 4 years ago #

    an url to your site would really help.

    Peter

  6. sharris203
    Member
    Posted 4 years ago #

  7. esmi
    Forum Moderator
    Posted 4 years ago #

    Try:

    input {
    border:1px solid #CACACA;
    font-size:12px;
    padding:5px;
    }
    input.eStore_button {border:none;}

    in that order in your stylesheet. The order is important.

  8. sharris203
    Member
    Posted 4 years ago #

    I see what you did there. It worked, thanks a lot!

  9. pilih template
    Member
    Posted 4 years ago #

    i have problem css image border on fresh news theme version 2.0.4

    input,select,textarea{
    border: #cacaca 1px solid;
    font-size: 12px;
    padding: 5px;
    }

    Way above does not work on my problem, please help me, thank's before.

  10. pilih template
    Member
    Posted 4 years ago #

    I seem to have managed to find a way how to remove image border on the fresh news theme. Download this style.css and upload your hosting.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags