• 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.

  • Posts

    • These are the Apple Watch models that support watchOS 26

      By Aditya Tiwari · Posted

      These are the Apple Watch models that support watchOS 26 by Aditya Tiwari Apple has announced the latest operating system upgrade for its smartwatch lineup, called watchOS 26, not watchOS 12, as many expected a while ago. The Cupertino giant has unified the software experience across its platforms by introducing the "Liquid Glass" software design and renaming all the operating systems to version 26. That said, the next question is which Apple Watch models will support watchOS 26. Apple has shared the official list of devices: Apple Watch Ultra 2 Apple Watch Ultra Apple Watch Series 10 Apple Watch Series 9 Apple Watch Series 8 Apple Watch Series 7 Apple Watch Series 6 Apple Watch SE (2nd Generation) The upcoming Apple Watch update brings several new features to your wrist. Liquid Glass design gives a fresh look to the UI with updated Control Center and translucent buttons within apps. It's new Workout Buddy feature can use an Apple Intelligence-enabled iPhone nearby to provide personalized, spoken motivation during workouts. Building on the Double Tap feature, you can now flick your wrist to perform actions like muting incoming calls, silencing timers, and dismissing notifications when your hands are full. It is available on Apple Watch Ultra 2 and Apple Watch Series 9 (or later). watchOS 26 is currently available for testing through the Apple Developer Program. It will roll out to general users during the fall season, when Apple is expected to refresh the Ultra and SE models. Note that your Apple Watch must be paired with an iPhone 11 (or later) or iPhone SE (2nd generation or later) running iOS 26. While the list of Apple Watch models that support watchOS 26 remains the same, it won't work with iPhone Xs/Xs Max and iPhone Xr, which were previously supported on watchOS 11. You can check out the respective lists of supported devices for iOS 26, iPadOS 26, and macOS 26 Tahoe.
    • Download Continuous Testing, Quality, Security, and Feedback eBook (worth $27.99) for free

      By BlackheavenJC · Posted

      Me thinks Microsoft could benefit from this...
    • Galaxy Z Fold7 to be the thinnest and lightest foldable from Samsung

      By Sagar Naresh · Posted

      Galaxy Z Fold7 to be the thinnest and lightest foldable from Samsung by Sagar Naresh Bhavsar A few days ago, Samsung shared an official teaser of their upcoming premium foldable, the Galaxy Z Fold7. Interestingly, the company titled the official post, "Meet the Next Chapter of Ultra," giving birth to a new rumor about a new "Ultra" foldable. The teaser highlighted Galaxy Z Fold7's tall and wide design, which previous rumors have suggested. The Galaxy Z Fold7 is also expected to come with a bigger display compared to the Galaxy Z Fold6. There were also rumors that Samsung could use a titanium backplate for improved durability and also make the device slim. Now, Samsung has shared a new teaser of the Galaxy Z Fold7 that adds a bit a weight to this rumor. Samsung has called the Galaxy Z Fold7 the "thinnest, lightest, and most advanced foldable yet." While the company didn't share any measurements or metrics that would define how thin or light the upcoming foldable is, the GIF shows the Galaxy Z Fold7 from the side (and it appears quite thin). Take a look for yourself: It would be safe to say that Samsung has been lacking in terms of making its foldable devices slim, even reducing the display crease. Though the company launched the Galaxy Z Fold6 Special Edition in China and Korea last year, which was their slimmest phone, it was nowhere near the likes of the OPPO Find N5. In terms of innovation as well, the company is far behind, and Chinese makers such as Huawei have already released the world's first triple-folding phone, the Mate XT. On the positive side, Samsung claimed that their "engineers and designers are refining each generation of the Galaxy Z series to be thinner, lighter, and more durable than the last," suggesting that the company could bring improvements with this year's foldable. The Galaxy Z Fold7 is expected to launch next month, in New York, in the second Unpacked event of the year, alongside the Galaxy Z Flip7. There are also rumors that the affordable version of the flip phone, the Galaxy Z Flip7 FE, could also launch at the event.
    • Here are the Macs that support macOS 26 Tahoe

      By MusicLover2112 · Posted

      I think Sequoia will be the last stop for my old 2012 Mac mini (with 16GB RAM & 512MB SSD). It runs Sonoma OK, so perhaps Sequoia will work well too. I don't have high hopes for Tahoe, however - that looks to be a GPU-intense OS.
    • Apple announces iOS 26 with Windows Vista-like 'Liquid Glass' redesign

      By Skyfrog · Posted

      The blobby, bouncy UI effects seem like they would get old really fast. https://www.youtube.com/watch?v=jGztGfRujSE

  • Recent Achievements

    • Explorer
      MusicLover2112 went up a rank
      Explorer
    • Dedicated
      MadMung0 earned a badge
      Dedicated
    • Rookie
      CHUNWEI went up a rank
      Rookie
    • Enthusiast
      the420kid went up a rank
      Enthusiast
    • Conversation Starter
      NeoToad777 earned a badge
      Conversation Starter

  • Popular Contributors

    1. 1
      +primortal
      504
    2. 2
      ATLien_0
      268
    3. 3
      +FloatingFatMan
      257
    4. 4
      Edouard
      202
    5. 5
      snowy owl
      177
    Show More

  • Tell a friend

    Love Neowin? Tell a friend!