The best example to illustrate what I'm talking about is if you go to http://www.tutorialforums.com and at the bottom on the right it says, "Login". Well the text fields and the submit button are flat on the page. I'm trying to achieve this but I'm not sure how. I don't want to use an actual *.css file but I do have a CSS portion at the top of the page. I don't know anything about CSS, however. Thanks!
Would this be CSS?
yes that would be css, make your submit button like this
<input type="submit" class="bginput" value="Login!">
and in your css declaration put
.bginput {
FONT-SIZE: 12px;
FONT-FAMILY: Verdana,Arial,Helvetica,sans-serif;
COLOR: #898989;
BACKGROUND-COLOR: #E0E0E0;
border: 0 solid #A4A5A5;
}
Yeah I figured it out kind of. Is there a way to get rid of the scroll bars on textareas? Thanks.
mess around with this
TEXTAREA {
scrollbar-arrow-color : #000000;
scrollbar-track-color : Window;
scrollbar-shadow-color : Window;
scrollbar-highlight-color : Window;
scrollbar-face-color : Window;
scrollbar-darkshadow-color : Window;
scrollbar-base-color : Window;
scrollbar-3dlight-color : Window;
border : none;
background-color : transparent;
}
Ohh I see, the same attributes can be used. Now if TEXTAREA refers to all textarea boxes, then why doesn't TEXT work for text fields? Stupid question, but while I'm at it, in the font family section, why are there always multiple font types? Looks like I'm going to spend tonight learning CSS.
instead of
TEXTAREA {
scrollbar-arrow-color : #000000;
scrollbar-track-color : Window;
scrollbar-shadow-color : Window;
scrollbar-highlight-color : Window;
scrollbar-face-color : Window;
scrollbar-darkshadow-color : Window;
scrollbar-base-color : Window;
scrollbar-3dlight-color : Window;
border : none;
background-color : transparent;
}
put this
.forminput{
scrollbar-arrow-color : #000000;
scrollbar-track-color : Window;
scrollbar-shadow-color : Window;
scrollbar-highlight-color : Window;
scrollbar-face-color : Window;
scrollbar-darkshadow-color : Window;
scrollbar-base-color : Window;
scrollbar-3dlight-color : Window;
border : none;
background-color : transparent;
}
then wherever you want it, put class="forminput", like
<input type="text" class="forminput">
or
<textarea rows="8" cols="60" class="forminput">
when putting a dot in front of a name in a style sheet you can use class="nameofname" in any attribute
Yeah I figured I was going to have to create my own class for it. Still though, I don't want any scroll bars on the text area so I'll have to figure out a way to do that. Thanks very much for the help!
Now if TEXTAREA refers to all textarea boxes, then why doesn't TEXT work for text fields?
Because it isn't a "TEXT", it's an input field. A textarea is defined by a <textarea> tag, and a text box is defined by an <input> tag, i.e. <input type="text" ...>
Stupid question, but while I'm at it, in the font family section, why are there always multiple font types?
Not a stupid question... you specify multiple fonts because not all systems will have all fonts, so you specify multiple fonts hoping at least one of them will be installed on the users system. I usually just specify the general family, rather than list all of the fonts, like this:
.classname {
font-family: sans-serif;
}
.classname2 {
font-family: serif;
}
classname3 {
font-family: monospace;
}
Here is a really good reference for all things CSS (and html for that matter): http://htmlhelp.com/reference/css/
Thanks for that. Having some problems with coloring the scroll bar but I'll get it. I still wish I could get rid of the scroll bar on the textarea all together, but this works too. Thanks for the help!
I've put a drop down menu in there and set the class to one of the other ones I was using but for some reason it's not following it as it should. The background color and text color changed properly but it doesn't look like the others, yet it's in the same class. It's sticking out like a sore thumb too, any suggestions? Thanks.
Originally posted by Radon3k
Yeah I figured I was going to have to create my own class for it. Still though, I don't want any scroll bars on the text area so I'll have to figure out a way to do that. Thanks very much for the help!![]()
I was gonna say what Yoda said, but he beat me to it.
As for making the scroll bar disappear, do this:
<textarea style="overflow:hidden">
As far as I know, the CSS1 and CSS2 specs don't allow you to completely remove the scrollbar. You could probably hack it with javascript, or something else creative, but it's usually not a good idea to stray from the standards.
Why is it so important to get rid of the scroll bar anyway?
¬_¬
be nice or I turn supa sayan and all
I don't mind leaving it the way it is. I just thought it might look better with the scroll bars gone. I did change the scroll bar colors for it so it at least blends in, no biggie. What about the select thing though, and why it's not changing colors or what not?
Haha. Did mzanimephp get moderated? There was a post there, now it's gone.
Anyway, it looks like I stand corrected... maybe. Is that was the overflow property really does? I was under the assumption that all it does is specify how text or what not is handled when it "overflows" it's container (div, span, etc. tag). I could be wrong though... it has been known to happen before (although very rarely hehe )
Originally posted by coditoergosum
Haha. Did mzanimephp get moderated? There was a post there, now it's gone.
I moderated myself okay?! :p LOL. (I have to self-dicisipline myself at times _)
But yeah, thats all it does. You can even add it to the body tag, and it'll remove the window scrollbar.
Do I want to know what you originally said?
So I'm a newbie to CSS, I'll learn though.
Anyways, I've been messing with this stupid select thing and it's rather annoying.
Originally posted by Radon3k
Do I want to know what you originally said?![]()
So I'm a newbie to CSS, I'll learn though.
Anyways, I've been messing with this stupid select thing and it's rather annoying.
No.. it was just a stupid joke about Yoda and the force. LOL.
Try this for your select issue, I just copied it from my CSS:
select {
font-family: "Trebuchet MS", Verdana, sans-serif;
font-size: 1em;
color: #000000;
background-color: #DEEFFF
}
That's essentially what mine has, yet it doesn't work. The border around the scroll bar and the pull down menu arrow is still the standard color altough I do have it changed in the CSS.
Do you have this?
{ border:solid 1px #000000; }
This will allow you to change the border color, but it won't effect the scrollbar (overflow) color.
As far as I know, the colors you set for the scrollbar, within the BODY selector, effect all the other scrollbars on the page... But as yoda said eariler, I'm sure there is a javascript to customize individual scrollbars, such as within <textarea> tags.