How to place the input box and button in same line

Question

I wanna know how to place the input box and the button in same line of text ("Get Daily Fresh Updates Directly To Your Mail") . Please help me out. I attached the code along with this message.Thanks in advance .

<html>
<head>
<style>
.rosyy{
color:#3e3e3e;
font-family: Impact, sans-serif;
font-size: 30px;
font-weight: normal;
line-height: 20px;
padding: 10px 0 0 10px;
text-shadow:0px 1px 0px #fff, 0px 2px 0px #C6C6C6;
}

.WG-91481wid {
background: url(http://2.bp.blogspot.com/-    ZRjmYjwpVLg/UOGBAUzNhrI/AAAAAAAAIc8/R6wrrCkJufI/s400/body.png);
margin: 20px;
border-radius: 10px 30px 10px 30px;
width: 1000px;
height: 90px;
color: #fff;
font-size: 14px;
padding: 15px;
transition:border-radius .5s;
-webkit-transition:border-radius .5s;
-moz-transition:border-radius .5s;
}
.WG-91481wid:hover{
border-radius:30px 10px 30px 10px;
}
.WG-91481wid p {
width: 350px;
line-height: 21px;
}

#subbox {
background: white url(http://2.bp.blogspot.com/-   dcien5QLnB8/UOb4N7eNU1I/AAAAAAAAAhw/NxzO8UXjgG4/s1600/subscribe-email.png) no-repeat right;
width: 200px;
padding: 10px;
color: #888;
border: 1px soiid #222222;
}
#subbutton {
background: #2aa4cf;
color: #fff;
border-radius: 5px 15px 5px 15px;
height: 40px;
border: 1px solid #292929;
text-transform: uppercase;
font-weight: bold;
transition:border-radius .5s;
-webkit-transition:border-radius .5s;
-moz-transition:border-radius .5s;
}
#subbutton:hover {
border-radius:15px 5px 15px 5px;
 }

 </style>   
 </head>

<body>
<div class="WG-91481wid">
<div class="rosyy">Get Daily Fresh Updates Directly To Your Mail

<form action="http://feedburner.google.com/fb/a/mailverify" id="subscribe"  method="post" onsubmit="window.open( 'http://feedburner.google.com/fb/a/mailverify? uri=HotNewsOfIndia', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"  target="popupwindow">
<input id="subbox" name="email" onblur="if ( this.value == &#39;&#39; ) { this.value = &#39;Enter your email address...&#39;; }" onfocus="if ( this.value == &#39;Enter your email  address...&#39;) { this.value = &#39;&#39;; }" value="Enter your email address..."  type="text" />
<input name="uri" value="HotNewsOfIndia" type="hidden" />
<input name="loc" value="en_US" type="hidden" />
<input id="subbutton" value="Subscribe!" type="submit" />
</form>


</div>
</div>
</body>

</html>

Answer 1

在此处输入图片说明 This is the output i got .
Just try adding the text inside the form tags like this : -

<form action="http://feedburner.google.com/fb/a/mailverify" id="subscribe"        method="post" onsubmit="window.open( 'http://feedburner.google.com/fb/a/mailverify? uri=HotNewsOfIndia', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"  target="popupwindow">
    Get Daily Fresh Updates Directly To Your Mail
    <input id="subbox" name="email" onblur="if ( this.value == &#39;&#39; ) { this.value =   &#39;Enter your email address...&#39;; }" onfocus="if ( this.value == &#39;Enter your email   address...&#39;) { this.value = &#39;&#39;; }" value="Enter your email address..."   type="text" />
    <input name="uri" value="HotNewsOfIndia" type="hidden" />
    <input name="loc" value="en_US" type="hidden" />
    <input id="subbutton" value="Subscribe!" type="submit" />
</form>

It is working for me . I am using Chrome . A working fiddle .

How to place the input box and button in same line

Question

1 answers

solution1
1 ACCPTED 2013-08-04 16:24:10

How to place the input box and button in same line

Question

1 answers

solution1 1 ACCPTED 2013-08-04 16:24:10

solution1
1 ACCPTED 2013-08-04 16:24:10