WordPress.org

Ready to get started?Download WordPress

Forums

Border around "Submit' Buttons and Header/Footer Logo (5 posts)

  1. DanHawkins
    Member
    Posted 1 year ago #

    I have similar problem at: http://www.strategic-si.com/

    I have very little experience with modifying stylesheets...

    I need a borderr around "Submit" buttons on Warranty Claim and Customer Data pages...
    When I change this stylesheet entry...
    /*******************/

    /* Site Basics */

    /*******************/

    *{ border-width: 0; margin: 0; padding: 0; list-style-type: none; outline: 0; text-align: left; }

    ...and modify the border width to "1" it puts the desired border around my buttons, BUT it also adds a border around all pics, etc...this would be OK but it puts a "pink" border that we don't like around our logo in header&footer....?

    HELP?

  2. Alain Lankers
    Member
    Posted 1 year ago #

    You'll need to give a class to the submit button:
    <input name="Submit" type="submit" value="Submit" class="border"/>

    then in your CSS add:
    .border {border:1px solid #999}

  3. DanHawkins
    Member
    Posted 1 year ago #

    Do you mean in my main Stylesheet.css or a custom.css?

    These "buttons" are part of a "form" which I can't find the config for in my style.css

    Would the below section "input.submit" be the correct place to make the change?

    [ Moderator note: Please wrap CSS and code in the backtick character or use the code button. ]

    /*********************/
    
    /*   Form elements   */
    
    /*********************/
    
    label { display: inline; float: left; clear: left; font: 12px "Lucida Grande", Lucida, Verdana, sans-serif; color: #7c7c7c; margin-bottom: 10px; margin-top: 10px; }
    
    input.in_small { height: 25px; width: 130px; float: left; display: inline; clear: left; border: 1px solid #d6d6d6; padding-top: 10px; }
    
    input.in_medium { height: 25px; width: 260px; display: inline; float: left; clear: left; border: 1px solid #d6d6d6; padding-top: 10px; }
    
    input.in_big { height: 25px; width: 390px; display: inline; float: left; clear: left; border: 1px solid #d6d6d6; padding-top: 10px; }
    
    textarea.in_textarea { display: inline; border: 1px solid #d6d6d6; clear: left; width: 100%; padding-top: 10px; line-height: 20px; }
    
    select.pull_small { float: left; display: inline; clear: left; width: 130px; height: 20px; }
    
    select.pull_medium { float: left; display: inline; clear: left; width: 260px; height: 20px; }
    
    select.pull_big { float: left; display: inline; clear: left; width: 390px; height: 20px; }
    
    input.submit { float: left; clear: left; background-image: url(images/b_small.jpg); width: 92px; height: 32px; margin-top: 10px; text-align: center; font-size: 13px; color: white; margin-bottom:15px; }
    
    input.in_search { float: right; display: inline; width: 147px; height: 24px; margin-top: 10px; color: #7e7e7e; padding-left: 15px; padding-right: 30px; background: url(images/searchfield.png) no-repeat; font-size: 13px; padding-top: 9px; }
  4. Alain Lankers
    Member
    Posted 1 year ago #

    You can add the rule in your stylesheet.css.

  5. DanHawkins
    Member
    Posted 1 year ago #

    ..and again, I can't find the properties of my button in my css forms.
    If I "inspect the element, I see it, but I don't know how/where to add the class="border"/ config...

    I hate feeling lost...

Topic Closed

This topic has been closed to new replies.

About this Topic