Results 1 to 8 of 8

Thread: css <input type='submit'> problem in IE

  1. #1
    cat /dev/null streetster's Avatar
    Join Date
    Jul 2003
    Location
    London
    Posts
    4,138
    Thanks
    119
    Thanked
    100 times in 82 posts
    • streetster's system
      • Motherboard:
      • Asus P7P55D-E
      • CPU:
      • Intel i5 750 2.67 @ 4.0Ghz
      • Memory:
      • 4GB Corsair XMS DDR3
      • Storage:
      • 2x1TB Drives [RAID0]
      • Graphics card(s):
      • 2xSapphire HD 4870 512MB CrossFireX
      • PSU:
      • Corsair HX520W
      • Case:
      • Coolermaster Black Widow
      • Operating System:
      • Windows 7 x64
      • Monitor(s):
      • DELL U2311
      • Internet:
      • Virgin 50Mb

    css <input type='submit'> problem in IE

    Hi clever people...

    I'm trying to make myself a website... and its all going quite well (imo!) but I thought i'd see what it looked like in IE - i use firefox, but I thought that i best have a look anyway...

    I've got a problem with all my <input type="submit"> buttons within IE... they have a wierd border-thing at the left, which isnt there in firefox.

    what css should I be using to make it work...

    i've made them '<input class="button".... ' which works fine in ff, but not in ie...

    have i got the wrong css 'header' im using:

    input.button {

    ... stuff inside here

    }


    basically, each button has a border-left: 2px solid #666666; which when you hover turn white... this functionality works, but the 'glitch' is still there, and I have *no* idea why.

    i've taken a couple of screenshots (click for the bigger image) :

    Firefox:


    Internet Explorer 7:



    any help would be very much appreciated, and if i'm being an idiot please tell me... I saw a page about using <button ......> </button> but couldn't figure out the css... also the navigation bar on the left uses <div class="button">... and these work fine.. its just the <input ... ones... and ive tried copying/pasting the *exact* same css between the ones that work and the <input...> ones and still no joy!

  2. #2
    cat /dev/null streetster's Avatar
    Join Date
    Jul 2003
    Location
    London
    Posts
    4,138
    Thanks
    119
    Thanked
    100 times in 82 posts
    • streetster's system
      • Motherboard:
      • Asus P7P55D-E
      • CPU:
      • Intel i5 750 2.67 @ 4.0Ghz
      • Memory:
      • 4GB Corsair XMS DDR3
      • Storage:
      • 2x1TB Drives [RAID0]
      • Graphics card(s):
      • 2xSapphire HD 4870 512MB CrossFireX
      • PSU:
      • Corsair HX520W
      • Case:
      • Coolermaster Black Widow
      • Operating System:
      • Windows 7 x64
      • Monitor(s):
      • DELL U2311
      • Internet:
      • Virgin 50Mb

    Re: css <input type='submit'> problem in IE

    anyone? css is available here if it helps

  3. #3
    cat /dev/null streetster's Avatar
    Join Date
    Jul 2003
    Location
    London
    Posts
    4,138
    Thanks
    119
    Thanked
    100 times in 82 posts
    • streetster's system
      • Motherboard:
      • Asus P7P55D-E
      • CPU:
      • Intel i5 750 2.67 @ 4.0Ghz
      • Memory:
      • 4GB Corsair XMS DDR3
      • Storage:
      • 2x1TB Drives [RAID0]
      • Graphics card(s):
      • 2xSapphire HD 4870 512MB CrossFireX
      • PSU:
      • Corsair HX520W
      • Case:
      • Coolermaster Black Widow
      • Operating System:
      • Windows 7 x64
      • Monitor(s):
      • DELL U2311
      • Internet:
      • Virgin 50Mb

    Re: css <input type='submit'> problem in IE

    i cant figure it out, and it looks like no-one else can eithe... its not the end of the world i just dont understand why it doesnt work

  4. #4
    Custom User Title
    Join Date
    Oct 2005
    Location
    Wirral UK
    Posts
    1,168
    Thanks
    10
    Thanked
    14 times in 14 posts
    • cougarslam's system
      • Motherboard:
      • Asus Maximus Formula SE (ROG)
      • CPU:
      • Core 2 Duo E6600 @ 3ghz
      • Memory:
      • 4gb Corsair DDR2
      • Storage:
      • 1TB
      • Graphics card(s):
      • BFG Nvidia 8800GT OC 512MB
      • PSU:
      • Corsair HX520
      • Case:
      • Zorro
      • Operating System:
      • Vista Business 32
      • Monitor(s):
      • 2 x 17" crt
      • Internet:
      • adsl max (entanet)

    Re: css <input type='submit'> problem in IE

    have you tried specifying the height of the button.

    a quick fix may be to specify borders for t,b,r as the same colour as button.

  5. #5
    Comfortably Numb directhex's Avatar
    Join Date
    Jul 2003
    Location
    /dev/urandom
    Posts
    17,074
    Thanks
    228
    Thanked
    1,027 times in 678 posts
    • directhex's system
      • Motherboard:
      • Asus ROG Strix B550-I Gaming
      • CPU:
      • Ryzen 5900x
      • Memory:
      • 64GB G.Skill Trident Z RGB
      • Storage:
      • 2TB Seagate Firecuda 520
      • Graphics card(s):
      • EVGA GeForce RTX 3080 XC3 Ultra
      • PSU:
      • EVGA SuperNOVA 850W G3
      • Case:
      • NZXT H210i
      • Operating System:
      • Ubuntu 20.04, Windows 10
      • Monitor(s):
      • LG 34GN850
      • Internet:
      • FIOS

    Re: css <input type='submit'> problem in IE

    however you're managing your rounded borders, IE isn't doing it quite right. i have the same issue with plain ol' <div> tags on my website

  6. #6
    cat /dev/null streetster's Avatar
    Join Date
    Jul 2003
    Location
    London
    Posts
    4,138
    Thanks
    119
    Thanked
    100 times in 82 posts
    • streetster's system
      • Motherboard:
      • Asus P7P55D-E
      • CPU:
      • Intel i5 750 2.67 @ 4.0Ghz
      • Memory:
      • 4GB Corsair XMS DDR3
      • Storage:
      • 2x1TB Drives [RAID0]
      • Graphics card(s):
      • 2xSapphire HD 4870 512MB CrossFireX
      • PSU:
      • Corsair HX520W
      • Case:
      • Coolermaster Black Widow
      • Operating System:
      • Windows 7 x64
      • Monitor(s):
      • DELL U2311
      • Internet:
      • Virgin 50Mb

    Re: css <input type='submit'> problem in IE

    Code:
    input.button {
    
    	width: 80px;
    	color: #ffffff;
    	padding: 4px 4px 4px 4px;
    	
    	margin-left: 20px;
    	margin-top: 10px;
    	
    	font-family: "Verdana", Arial, Helvetica, Sans-serif;
    	font-weight: 400;
    	font-size: 10px;
    	text-align: center;
    	
    	background: #9FBBC5;
    	
    	border: 0px;
    	border-left: 2px solid #9FBBC5 ;
    	
    }
    
    input.button:hover {
    	
    	border-left: 2px solid #666666;
    
    }
    which is the same css for the plain 'button' divs, the problem only exists in IE with the <input ....> tag - unless there is another way of creating buttons on forms? I suppose i could do some javascript to submit the form onclick()?
    Last edited by streetster; 08-12-2007 at 09:47 AM.

  7. #7
    Member
    Join Date
    Sep 2007
    Location
    Leeds
    Posts
    166
    Thanks
    4
    Thanked
    5 times in 5 posts
    • Clockwork_Killa's system
      • Motherboard:
      • Asus KFN5-D SLI
      • CPU:
      • Opteron 2212 (2x)
      • Memory:
      • 4 gig Kingston ecc reg in dual channel
      • Storage:
      • 2x Raptor 36gig in raid 0, 1 Raptor X
      • Graphics card(s):
      • Fire GL 3100
      • PSU:
      • Corsair HX620
      • Case:
      • Coolermaster CM Stacker EVO
      • Monitor(s):
      • NEC Multisync 90GX2
      • Internet:
      • BE

    Re: css <input type='submit'> problem in IE

    Try creating a whole new class instead of having a sub class inside input, Ive had problems with that before, IE can be such a pain in the ass.

  8. #8
    lazy student nvening's Avatar
    Join Date
    Jan 2005
    Location
    London
    Posts
    4,656
    Thanks
    196
    Thanked
    31 times in 30 posts

    Re: css <input type='submit'> problem in IE

    IE must be the number one cause of depression of web devs - hours of work on FF, and it looks sweet - boot up IE - WTH??!!



    Apparently IE 8 will be better
    (\__/)
    (='.'=)
    (")_(")

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Similar Threads

  1. IE7 problem - please help?
    By SkyNetworks in forum Help! Quick Relief From Tech Headaches
    Replies: 5
    Last Post: 20-06-2007, 09:36 PM
  2. ECS 910 / Advent 7080 White Screen and no VGA problem Notebook Laptop
    By David R in forum PC Hardware and Components
    Replies: 0
    Last Post: 18-06-2007, 05:52 AM
  3. Fatality FP-IN9 resume from S3 problem
    By $kunk in forum abit.care@HEXUS
    Replies: 0
    Last Post: 22-05-2007, 04:07 PM
  4. Question about problem recently built computer
    By shadowneo in forum SCAN.care@HEXUS
    Replies: 3
    Last Post: 18-04-2007, 02:31 PM

Posting Permissions

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