Trouble with adjusting the text portion of my form


#1

Hi,

I can't figure out how to make the border around the text-search portion of my form display as a straight line beneath it and not a box. I tried adjusting the border but with no luck.

Here is the link to my code: https://gist.github.com/mcruz590/86361cf8f1f5b3a95f69ba59e94d5856


#2

I'm sorry I don't understand you can you rephrase ?


#3

Sorry. In order to have the portion that says "browse the collection" and "search", I needed to create a form. The form automatically puts a box around "browse the collection" but, I want it to display just as line beneath the text. Here is what it is suppose to look like...


#4

You going to have to style it using the id search, make background transparent, set border to 0, border radius to 0, add a border-bottom as you want the line, add a width to make it wider

Give it a try.

See correct code

#search {
        background:transparent; 
        border:0px; 
        border-radius:0; 
        border-bottom:1px solid #fff;
        color:#fff;
        font-size:18px; 
        margin:0 20px; 
        width:400px;
      }