[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 725
  • Last Modified:

Form fields and buttons look like "xp style" under windows 98

I want a css for making fileds and buttons in a form page  to look like windows xp (blue margins and little rounded) under windows 98.
In windows xp this style is maded by selected windows style.
0
krokutz
Asked:
krokutz
  • 4
1 Solution
 
GrandSchtroumpfCommented:
you will need to use images for your buttons.
take a look at this page:
http://www.456bereastreet.com/archive/200409/styling_form_controls/
0
 
neesterCommented:
Yes like GrandSchtroumpf said.
You need to use images.
To do this use:

<input type="image" src="xpbuttonfile.jpg" name="submit" />

that will turn an image into a submit button.

Simply screenshot the butto you want...
eg:

<input type="submit" value="Submit Form!" />

Run that in XP and screenshot the page with something like Irfanview32 (www.irfanview.com)
Just run irfanview, select the Browser with the submit button showing.
Then hold CTRL+F11.
Then Irfanview will have the page loaded into its window.
Then CROP the button, by selecting the button by drawing the box.
Hold CTRL+Y to crop.
Then save it.
Then upload it.
Then use the FIRST bit of code I showed you
0
 
neesterCommented:
BTW
you cannot style - and SHOULDN'T even try becuase it wont work - drop downs, check boxes, radio buttons.
Text boxes you can ALMOST get looking like IE.
If you use a background image with CSS.
But it wont look the same, unless you take a screenshot for every case - or if the boxes are to be the same size in all cases...
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
neesterCommented:
Incase you DO want to style the text boxes, since other than the submit button.
They are all you can style.
Do the same process as with the Submit button.
But to a textbox.
Then add this to the textbox code:

<input type="text" style="width: 200px; height: 30px; background-image: url(yourtextboximage.jpg);" name="text" />

Make note that you will need to change the wdith and height values to make it look right.
0
 
krokutzAuthor Commented:
that was that i wanted :D
0
 
neesterCommented:
Ok Great!
Glad I could help!
0

Featured Post

How to Use the Help Bell

Need to boost the visibility of your question for solutions? Use the Experts Exchange Help Bell to confirm priority levels and contact subject-matter experts for question attention.  Check out this how-to article for more information.

  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now