CSS Issue in Chrome / Safari

[KevinStrong]

Hey gurus,

Can someone please explain to me why this code isn’t working on chrome and safari?

HTML:

`

input type=”image” name=”submit” id=”af-submit-image-1731798193″ class=”image” alt=”Download” tabindex=”501″>

( *I had to remove part of a couple of “>” in this html above for it to show up. Sorry if it’s not allowed to post. )

.btn.green {
background: -moz-linear-gradient(center top , #5DBB73 0%, #2D9047 100%) repeat scroll 0 0 transparent;
border-color: #1D692D;
box-shadow: 0 1px 1px #94DDA6 inset, 0 1px 2px rgba(0, 0, 0, 0.61);
color: #FFFFFF;
font-size: 17px;
height: 39px;
line-height: 56px;
margin-left: 300px !important;
margin-top: 15px !important;
padding: 8px 8px 8px 29px;
width: 143px;
}

.image {
color: #FFFFFF;
font-family: Helvetica Neue;
font-size: 17px !important;
font-weight: bold;
text-shadow: 0 1px 2px #114A1E, 0 1px 0 #114A1E;
}

It’s supposed to be a green button with white text. It’s working well in firefox,
but it’s not showing the text of the button in chrome or safari

[Paulie_D]

You are missing an opening angle bracket

…..> [HERE] input type

[KevinStrong]

Paulie I have the openining angle on my website. I had to remove it as it wouldn’t let me post the full HTML

Here’s the webpage it’s on: http://100freeplugins.com/members/edwin/

[Paulie_D]

I know this is going to sound silly…but what isn’t working?

Is it something wrong with the input?

What is it you are trying to do?

[Paulie_D]

Ah…I don’t think you have defined the `src’ of the image…could that be it?

[Mag]

If you change type to submit you would make the text to show in chrome..

I mean this:
type=”submit”

[Paulie_D]

I’m assuming from the other code [`id=”af-submit-image-1731798193″`] that this is supposed to be an image.

[Mag]

KevinStrong wrote in the first post that: “It’s supposed to be a green button with white text.”
There’s no mention there’s supposed to be an image anywhere.. ;)

[Paulie_D]

Ah, you are correct…but this would imply that it is an image.

type=”image” & class=”image”

If we change the type to `submit` and add `value=”Download”` does that do it?

[Mag]

Yeah:) I’ve just tested that in jsfiddle in chrome..

[Paulie_D]

Hmmm….no apparently it doesn’t…there’s some weird stuff happening.

I do know you can do this without the wrapping div

http://codepen.io/anon/pen/siwkv

[Paulie_D]

>Yeah:) I’ve just tested that in jsfiddle in chrome..

Do you have a link because Codepen was funky….perhaps I messed it up somehow.

[KevinStrong]

Thanks for the help so far guys.

That change defnitely made the text show up – but now I’m getting
a gray inside the button in all browsers:

[Paulie_D]

Try `background:none ` on `.image`.

It got funky in Chrome when I did that in Codepen and left a box-shadow which I’m trying to figure out.

[KevinStrong]

That did it Paulie, thanks man.

I’m glad they keep you around :)

[Author]

Posts