The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Can i style my textarea this way using css?

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #36222

    Howdy yall, im designing a very small form for my personal site. Basically i am styling my text boxes with no backgrounds but just a bottom border. Now my text area i would like to have it look “lined” like my text boxes.

    Here is the screen shot:

    And here is the CSS:

    #text-input {
    border-bottom:1px solid #1d1d1d;
    border-top:none !important;
    border-left:none !important;
    border-right:none !important;
    padding:0px 0px 0px 10px;
    font-family: 'Handlee', cursive;
    text-transform: lowercase;

    The html code:

    Clearly three text boxes is not what i want to achieve, but i merely added them to show my desired effect.

    Basically i want to style a textarea to have lines, is this possible with just css?

    I appreciate any feedback.


    u would always declare border top, left, bottom, right styles
    just set the colours to the same as ur background or use rgba(255,255,255,0) (white, invisible)


    Shart, i believe there was a little misunderstanding or maybe i wasn’t clear in which i apologize but i already know that i need a textarea.. The three text boxes were just there for graphical reasons. The empty placeholders actually had content that i deleted and setting my border styles is sloppy? My attempt of being semantic isn’t what i’m asking about because i do just fine.

    The original question is how to style a textarea to look like how i had those three text boxes..


    I believe Matt87 answered. If it works like you want, will you post back and let us see, so this can be marked as “SOLVED” :)

    Using your code and Matt87’s suggestion, it works. I added border-radius,

    Looks cool. I love the way you created the form image.


    Essentially my latest attempt didnt give me my desired effects however i had just kept the basic idea but keep my labels underlined and my input areas (textarea, input=”text”) will have a styled left/bottom border.

    Screen shotty:

    Thanks Voila!

    , when i post code on forums i try to ensure its nice and tidy, just didn’t have time, but its cool thank you.

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.