Salvador Dali
Salvador Dali

Reputation: 222869

How can I remove a well-like border from input?

I wanted to achieve the same effect with input element as I can achieve with contenteditable attribute. What I have done can be seen in jsFiddle.

HTML :

<div class="greenStripe">
    <input placeholder="Title" class='t'/>  
</div>

CSS :

.greenStripe{
    background-color:#13b4ff;
    width: 100%;
    height: 100px; 
}
.greenStripe .t{
    margin: 20px 0 0 10%;
    font-size: 42px;
    background-color:#13b4ff;
}

Basically <input/> looks almost the same as contenteditable, but I have this terrible borders. Can I somehow get rid of them with CSS?

Upvotes: 2

Views: 242

Answers (1)

potashin
potashin

Reputation: 44601

input { border-style: none; outline: 0; }

JSFiddle

Upvotes: 7

Related Questions