Peeter
Peeter

Reputation: 199

visibility:hidden in firefox how to?

I have code like this:

.module::first-letter{
    visibility:hidden;
}

But this solution is not working on Firefox:( Display:none; not working with "::first-letter" CSS code :(

How can I hide first letter in Firefox?

Upvotes: 1

Views: 1762

Answers (3)

dippas
dippas

Reputation: 60573

you can always try setting font-size:0 while this is not fully supported.

.module::first-letter{
    font-size:0
}
<div class="module">Hide Letter H  </div>

or as last resort color:transparent

.module::first-letter {
  color: transparent
}
<div class="module">Hide Letter H</div>

Note the difference between both, 1st removes the letter space, second one doesn't.

Upvotes: 2

Paulie_D
Paulie_D

Reputation: 115288

As mentioned in the other answers the properties that can are used is limited but it's possible other browser vendors are initiating greater support

As this list will be extended in the future, it is recommended that you not use any other properties inside the declaration block, in order to keep the CSS future-proof.

Source: MDN

Upvotes: 0

AtheistP3ace
AtheistP3ace

Reputation: 9691

Note: The following properties can be used with ::first-letter:

  • font properties
  • color properties
  • background properties
  • margin properties
  • padding properties
  • border properties
  • text-decoration
  • vertical-align (only if float is 'none')
  • text-transform
  • line-height
  • float
  • clear

http://www.w3schools.com/cssref/sel_firstletter.asp

Another note, it only works with block level elements, I am not sure, and I could be wrong, you can hide the first letter with only CSS. Quite easy in JS to pull off.

Upvotes: 1

Related Questions