Newsletter module alignment

[greeneyedesign]

Hi,

 

I might be overlooking something obvious, but I can't get my dropdown and button on the same line (see picture). I've checked that the column is wide enough for the two to be on the same line.

 

This is my blocknewsletter.tpl code:

 

<!-- Block Newsletter module-->
<div id="newsletter_block_left" class="block">
<h4>{l s='Newsletter' mod='blocknewsletter'}</h4>
<div class="block_content">
{if $msg}
 <p class="{if $nw_error}warning_inline{else}success_inline{/if}">{$msg}</p>
{/if}
 <form action="{$base_dir}" method="post">
  <p><input type="text" name="email" size="18" value="{if $value}{$value}{else}{l s='your e-mail' mod='blocknewsletter'}{/if}" onfocus="javascript:if(this.value=='{l s='your e-mail' mod='blocknewsletter'}')this.value='';" onblur="javascript:if(this.value=='')this.value='{l s='your e-mail' mod='blocknewsletter'}';" /></p>
  <p>
<select name="action">
 <option value="0"{if $action == 0} selected="selected"{/if}>{l s='Subscribe' mod='blocknewsletter'}</option>
 <option value="1"{if $action == 1} selected="selected"{/if}>{l s='Unsubscribe' mod='blocknewsletter'}</option>
</select><input type="submit" value="OK" class="button_mini" name="submitNewsletter" />
  </p>
 </form>
</div>
</div>
<!-- /Block Newsletter module-->

 

and this is the CSS:

 

/* Block newsletter */
div#newsletter_block_left  {
border-top-width: 1px;
border-top-style: solid;
border-top-color: #CCC;
}
div#newsletter_block_left div.block_content {
padding:1em 0;
text-align:center;
color:#374853;
}
div#newsletter_block_left div.block_content p{ padding:0.3em 0; text-align:center; }
div#newsletter_block_left div.block_content input.button_mini{ margin:1em auto 0em auto;}

 

Help is much appreciated

[lettersets]

I can't get my dropdown and button on the same line (see picture).

 

Hi,

 

I'd like to do the same. Did you manage to fix this?

[tdr170]

Give this a shot past this into the blocknewsletter.css or make the changes you see in this code.

Your CSS seems a little different this is from 1.4.7, mine does not have the div#newsletter_block_left section.

 

 

 

div#newsletter_block_left div.block_content { padding: 1em 0; text-align: center }

div#newsletter_block_left div.block_content p { padding: .7em 2em .8em; text-align: left }

div#newsletter_block_left div.block_content input.button_mini { margin: -18px 0px 0px 120px }

Edited June 16, 2012 by tdr170 (see edit history)

[lettersets]

Thanks, works like a charm. To get it just right, I tweaked it as following:

 

In the theme>css>modules>blocknewsletter.css

 

div#newsletter_block_left div.block_content {  padding : 1.5em  0 ; text-align : center  }
div#newsletter_block_left div.block_content p {  padding : .1em  1.5em  .6em 1.5em ; text-align : left  }
div#newsletter_block_left div.block_content input.button_mini {  margin : -18px  0px  0px  120px  }

 

I also made the entry box a litle vit wider, but changing the following in modules>blocknewsletter>blocknewsletter.tpl :

 

<input type="text" name="email" size="18"

 

to:

 

<input type="text" name="email" size="20"

[tdr170]

Great glad I could help! A liitle tweak never hurts