Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Jun 2002
    Location
    Texas
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    border on a Select

    I have used a style statement to make my inputs look a certain way. It does not want to work for the drop down list.
    Can someone please tell me how to make my drop down look like the other text inputs? Or point me in the right direction.

    http://home.earthlink.net/~optimum/cxw101test.htm

    Thanks

  • #2
    Senior Coder
    Join Date
    Aug 2002
    Posts
    3,467
    Thanks
    0
    Thanked 0 Times in 0 Posts
    They won't receive border styles in IE. SELECT objects are windowed controls (provided by the OS, not the browser)

    http://msdn.microsoft.com/workshop/a...cts/select.asp
    Click on the 'Styles' link to see what styles the select supports in IE

    NS and Moz use their own widgets for selects, so they can recieve border styles (as well as others)
    My Site | fValidate | My Brainbench | MSDN | Gecko | xBrowser DOM | PHP | Ars | PVP
    “Minds are like parachutes. They don't work unless they are open”
    “Maturity is simply knowing when to not be immature”

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    NL
    Posts
    421
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Just add a border here:

    .dsp1 {border:1px solid #670001;font-family:arial;font-size:12;color:black;}

  • #4
    Senior Coder
    Join Date
    Jun 2002
    Posts
    1,404
    Thanks
    2
    Thanked 32 Times in 32 Posts
    As stated, select border is pretty hard-wired...you can sort of 'disguise' it:

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <style type="text/css">
    <!--

    .ent1 {
    font: 200 12px arial,verdana,sans-serif;
    color: black;
    }

    .dsp1 {
    position: relative;
    font: 400 10px arial,verdana,sans-serif;
    color: white;
    border: 1px solid #670001;
    background: black;
    }

    -->
    </style>
    </head>
    <body vlink="#0000FF" alink="#0000FF">
    <table width=100%>
    <tr>
    <td class="ent1" nowrap><b>Last Name</b>
    <font color=red>*</font>&nbsp;&nbsp;
    <input class="dsp1" type="text" size="25" maxlength="25" name="vlname">&nbsp;&nbsp;
    <select class="dsp1" style="position;relative;top:2px;background:black;color:white;" name="vsuff" onchange="vfname.focus()">
    <option value="None">None</option>
    <option value="JR">Jr.</option>
    <option value="SR">Sr.</option>
    </select>&nbsp;&nbsp;
    <b>First Name<font color=red>*</font></b>&nbsp;
    <input class="dsp1" type="text" size="20" name="vfname">
    &nbsp;&nbsp;<b>MI</b>&nbsp;
    <input class="dsp1" type="text" size="1" name="vmname"></font>
    </td></tr></table></form></body></html>

    ...or:

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <style type="text/css">
    <!--

    .ent1 {
    position:relative;
    font: 200 12px arial,verdana,sans-serif;
    color: black;
    }

    select.dsp1 {
    position:relative;
    top: 1px;
    font: 400 10px arial,verdana,sans-serif;
    color: black;
    background: #f5f5f5;
    }

    input.dsp1 {
    font: 400 10px arial,verdana,sans-serif;
    color: black;
    border: 2px inset #c0c0c0;
    border-top: 2px inset #c0c0c0;
    border-right: 1px inset #c0c0c0;
    border-bottom: 1px inset #c0c0c0;
    border-left: 2px inset #c0c0c0;
    background: #f5f5f5;
    }

    -->
    </style>
    </head>
    <body vlink="#0000FF" alink="#0000FF">
    <table width=100%>
    <tr>
    <td class="ent1" nowrap><b>Last Name</b>
    <font color=red>*</font>&nbsp;&nbsp;
    <input class="dsp1" type="text" size="25" maxlength="25" name="vlname">&nbsp;&nbsp;
    <select class="dsp1" name="vsuff" onchange="vfname.focus()">
    <option value="None">None</option>
    <option value="JR">Jr.</option>
    <option value="SR">Sr.</option>
    </select>&nbsp;&nbsp;
    <b>First Name<font color=red>*</font></b>&nbsp;
    <input class="dsp1" type="text" size="20" name="vfname">
    &nbsp;&nbsp;<b>MI</b>&nbsp;
    <input class="dsp1" type="text" size="1" name="vmname"></font>
    </td></tr></table></form></body></html>
    Last edited by adios; 10-04-2002 at 02:50 AM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •