Duplicating this CSS for another control

Posted on 2013-08-30
Medium Priority
Last Modified: 2013-08-31
I've bought this template

and if you scroll down, there's a button. The CSS for it is button.btn and it renders as such

<button type="submit" class="btn"><span>Sign me up!</span></button>

Open in new window

I've used an ASP.Net login control that renders like this

<input type="submit" name="Login1$Login" value="Sign In" id="Login1_Login" class="btn">

Open in new window

So I created a new CSS but mine renders as a standard submit button (those grey buttons) with a black line in the middle. See attached screenshot. So, what did I miss?

    padding: 0 28px 0 0; 
	font-size: 1em; 
	text-align: center; 
	position: relative;
	cursor: pointer;
	overflow: visible;
	background: transparent url("../images/button-sprite.gif") no-repeat right -92px; }  

Open in new window

Question by:Camillia
1 Comment
LVL 43

Accepted Solution

Rob earned 2000 total points
ID: 39454393
i think you're almost there and it's just your positioning

try moving the background-position around


background: transparent url("../images/button-sprite.gif") no-repeat;
background-position: left top;

Open in new window

otherwise give me a link to it and i can tell you exactly what you need

Featured Post

Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

This is a how to build your own CSS3 slideshow and when I say CSS3 I mean just CSS with no javascript in sight! There a few examples online of how to do this but most just show you an example without any explanation, others make it more complicat…
As a result of several questions about how to use Bootstrap I thought it would be a good idea to write down the development aspect of creating a Bootstrapped website in as little time as possible. Part 1 of this article will only concentrate on g…
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

627 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question