• 0

Default <Input> Font

Asked by Tanoru,

 Share

Question

12 answers to this question

Recommended Posts

  • 0
Grand Master

+Majesticmerc MVC

Posted
  • MVC
Posted
  On 02/03/2010 at 10:23, Tanoru said:

@Decryptor Sorry I wasn't clearer before, I knew that. I have a span element inside my div ID'd search =)

In that case, your selector is the wrong way round. What you should have is:

div#search input {
    font-family:whatever;
}

Which styles all inputs that are children of the div with the ID "search". Parent elements are always on the left :)

  • 0
Community Regular

Tanoru

Posted
  • Author
Posted

Ok after going back and looking at my code, what I ACTUALLY have is :

#search input {

background:none;

border:none;

color:#ccc;

height:26px;

margin-top:-1px;

padding-left:4px;

text-shadow:0px 2px 2px #000;

width:170px;

}

when I add font-family to that it has no effect. =/

  • 0
Community Regular

Tanoru

Posted
  • Author
Posted

Probably what I should have just done at the start to save this confusion.

HTML

<span id="search">

<input name="search" type="text" value="Search this website..." onclick='this.value = "";' onblur="if (this.value == '') {this.value = 'Search this website...';}" onfocus="if (this.value == 'Search this website...') {this.value = '';}" />

</span>

CSS

#search input {

background:none;

border:none;

color:#ccc;

height:26px;

margin-top:-1px;

padding-left:4px;

text-shadow:0px 2px 2px #000;

width:170px;

}

  • 0
Grand Master

The_Decryptor Veteran

Posted
  • Veteran
Posted 

&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"&gt;
&lt;html lang="en"&gt;
    &lt;head&gt;
        &lt;title&gt;Test&lt;/title&gt;
        &lt;style type="text/css"&gt;
            #search input {
                background:none;
                border:none;
                color:#ccc;
                height:26px;
                margin-top:-1px;
                padding-left:4px;
                text-shadow:0px 2px 2px #000;
                width:170px;
                font-family: monospace;
            }
        &lt;/style&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;p&gt;
            &lt;span id="search"&gt;
                &lt;input name="search" type="text" value="Search this website..." onclick='this.value = "";' onblur="if (this.value == '') {this.value = 'Search this website...';}" onfocus="if (this.value == 'Search this website...') {this.value = '';}" /&gt;
            &lt;/span&gt;
        &lt;/p&gt; 
    &lt;/body&gt;
&lt;/html&gt;

That works fine for me.

  • 0
Apprentice

kavisiegel

Posted
Posted

If putting a value in font-family isn't working... is the font name spelled correctly? is the font a default font, currently on your PC? If the font has a space in its name, does it have quotes around it? Is it the child element to another node that has a font assigned? Have you tried adding !important?

This topic is now closed to further replies.
 Share
Go to question listing

  • Recently Browsing   0 members

    • No registered users viewing this page.