"Preview , Send,Reset. "

How can I move these buttons to the center?

Forum version : PunBB

In the templates section, there should Post and private message section. Then posting_body. Find this code

Code:

<!-- BEGIN switch_preview -->
<input class="liteoption" type="submit" name="preview" value="{L_PREVIEW}" tabindex="5" /> 
<!-- END switch_preview -->
<!-- BEGIN switch_draft -->
 <input class="liteoption" type="submit" name="draft" value="{L_DRAFT}" tabindex="7" accesskey="d" /> 
<!-- END switch_draft -->
<!-- BEGIN switch_publish -->
 <input class="liteoption" type="submit" name="publish" value="{L_PUBLISH}" tabindex="8" accesskey="p" /> 
<!-- END switch_publish -->
 <input class="mainoption" type="submit" name="post" value="{L_SUBMIT}" tabindex="6" accesskey="s" />
</td>
</tr>

Replace with

Code:


<!-- BEGIN switch_preview -->
<center><input class="liteoption" type="submit" name="preview" value="{L_PREVIEW}" tabindex="5" /> </center>
<!-- END switch_preview -->
<!-- BEGIN switch_draft -->
<center> <input class="liteoption" type="submit" name="draft" value="{L_DRAFT}" tabindex="7" accesskey="d" /> </center>
<!-- END switch_draft -->
<!-- BEGIN switch_publish -->
<center> <input class="liteoption" type="submit" name="publish" value="{L_PUBLISH}" tabindex="8" accesskey="p" /> </center>
<!-- END switch_publish -->
<center> <input class="mainoption" type="submit" name="post" value="{L_SUBMIT}" tabindex="6" accesskey="s" /></center>
</td>
</tr>


and try that it should work. also it looks like there is an <hr> tag there, if you dont want that just delete it, itll make it more smooth looking.

He's talking about quick reply.
In which case this CSS would do it:

Code:

#pun-qpost .frm-buttons { text-align: center }

Thanks.
But now they look like this.

Can I make it so they're all lined up next to each other?

Well you'll have to visit whatever tutorial you used to add the reset button.

LGforum wrote:Well you'll have to visit whatever tutorial you used to add the reset button.

I used this code and put it in my Javascript.

Code:

    $(document).ready(function(){$('input[name="post"]').after('<div><input type="reset" name="reset" class="button2" value="Reset"></div>')});

Just change it this:

Code:

 $(document).ready(function(){$('input[name="post"]').after('<input type="reset" name="reset" class="button2" value="Reset">')});

The DIV tags were making it go on its own line. DIV elements are "block" elements, meaning they have display:block by default.

LGforum wrote:Just change it this:

Code:

 $(document).ready(function(){$('input[name="post"]').after('<input type="reset" name="reset" class="button2" value="Reset">')});

The DIV tags were making it go on its own line. DIV elements are "block" elements, meaning they have display:block by default.

That was the problem?
Thanks!
Topic solved.