Display:Block as an input submit, is it possible?

Question

Is it possible to us a display:block for and input submit? or do I have to create an image for the submit button?

<div class="signin_btn">
<a title="Current Members Sign-In" class="l_helpl" href="/">SIGN-IN</a>
</div>

@Kobi yes, it is. that's currently the display:block I want as an input submit button — acctman, Oct 10 '11 at 06:03
check this http://stackoverflow.com/questions/1030793/input-with-displayblock-is-not-a-block-why-not may be that's you want — sandeep, Oct 10 '11 at 06:30

score 0 · Answer 1 · answered Oct 10 '11 at 06:24

You can even do this

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Test</title>
</head>
<body>
<style type="text/css">
.button
{
   width: 100px;
   height: 200px;
   background-color: Red;
   cursor: pointer;
   display: block;
</style>
<div>

<a href="http://www.bbc.co.uk" class="button"></a>

</div>

</body>
</html>

Adam Fordham · Answer 2 · 2011-10-10T07:05:16.677

-1

<a title="Current Members Sign-In" class="l_helpl" href="/">
<span class="signin_btn">
SIGN-IN
</span>
</a>

This should do the trick. And of course change your styling to suit the changes.

edited Oct 10 '11 at 07:05

answered Oct 10 '11 at 06:21

Adam Fordham

73
5

Whats with the neg feedback this is w3c compliant, and this is the most straight forward way of doing what needs to be done without making an image or using jquery. – Adam Fordham Oct 10 '11 at 06:27
never put block element inside an inline element. You can use SPAN instead DIV. a is an inline element – sandeep Oct 10 '11 at 06:45
my bad I its late and I wasnt thinking – Adam Fordham Oct 10 '11 at 07:05

score -1 · Answer 3 · answered Oct 10 '11 at 07:21

-1

I think it is stupid for a person having more than 500 reps to ask this question. Anyway here is how I would do it

<div class="signin_btn">
<a title="Current Members Sign-In" class="l_helpl" href="/" style="display:block;">SIGN-IN</a>
</div>

But please be remembered that it is a bad practice to have a block level element inside an inline element.

answered Oct 10 '11 at 07:21

defau1t

10,593
2
35
47

What would a person's rep have to do with their CSS knowledge? – user123444555621 Oct 10 '11 at 07:24

Display:Block as an input submit, is it possible?

3 Answers3