0

I'm new to html & css, and I'm trying to have non-editable (permanent) centered text inside a colored inset border textbox. I can't seem to get permanent text within the textbox. Any text I type seems to go outside of the textbox.The 9px inset part isn't working as well. I have attatched a picture of what I'm trying to do. Here's my code that I'm using: html: 

Page <input size="3" name="uid"> of 1

css: INPUT,SELECT,TEXTAREA
{background-color: black; color: white;
border:9px inset #2121; border-color: #444;}

INPUT,SELECT { font-size: x-small; }

Picture: https://i.stack.imgur.com/w2QeO.png Here's some code that I found that makes text appear un-editable. I'm unsure how to change the border color & size in html though. http://www.w3schools.com/css/tryit.asp?filename=trycss_border-style

Rakuten
  • 33
  • 9

1 Answers1

0

Try adding text-align: center; to your style for the input

g4s_g33k
  • 16
  • 3
  • I added some missing information. Thanks for your reply, it's much appreciated ^_^ – Rakuten Sep 02 '15 at 04:54
  • You could use `padding` or `margin` and their variants such as `padding: 10px 20px;` or `padding-bottom: 10px;` in your style. Play around with that. You could also try `height: 30px;`, `width: 60px;` and border-color can be set by `border: 9px inset #444;'. Take out the #2121 - that's not even a color. – g4s_g33k Sep 02 '15 at 14:04
  • Thanks for your help! Adding text-align helped. Here's the code that I'm using now. HTML: `page of 1' CSS: `#uid { background-color: black; color: white; border: 2px inset #444; border-color: #f5f5f5; text-align: center; width: 33px; }` – Rakuten Sep 02 '15 at 21:37