MyBB Hacks

Full Version: [SOLVED] <a> links on same line with 'floating' (not &nbsp; ) space between ?
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Trying to put a couple text/object links on page at opposite sides of the page and on the same line (per code below).

&nbsp; sort-of works, but wraps text/objects prematurely when page window is made smaller.

Code:
<div>  
<style="float: left; text-align: left;">
<a href="{$mybb->settings['bburl']}/search.php">
<img src="{$theme['imgdir']}/toplinks/search.gif" alt="" title="">
{$lang->toplinks_search}
</a>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

<style="float: right; text-align: left;">
<a href="http://www.forum.info/index.htm"> 
<font size="4;" color="#0066CC"> Go to Location (click here)</font>
</a>
</div>



Tried looking at places like http://www.w3schools.com/tags/ etc, but seems like there is not a good spacer tag that does what need.

Suggestions on place/s to look ?

Also, any other comments on way trying (ie code crudeness) to do it would be appreciated.

Ps: Sorry for all the beginner mod questions. If not wanted, please let know better place to post.

Why not using the white-space property or the margin one?
You could try  this :

HTML Code
<div style="width:100%;">
<div><a href="http://www.leefish.nl/mybb/portal.php">HALLO</a></div>
<div style="float:right;margin-top:-25px;"><a href="http://www.forum.info/index.htm">goodbye</a></div>
</div>

(02-20-2012 11:38 AM)Sama34 Wrote: [ -> ]Why not using the white-space property or the margin one?

Thanks much !
Added to code (hope did right) below (part of template: header) and works like advertised.

Code:
<head>
<style type="text/css">
p
{
white-space:nowrap;
}
</style>
</head>
<div>  
<p>
<a href="{$mybb->settings['bburl']}/search.php">
<img src="{$theme['imgdir']}/toplinks/search.gif" alt="" title="">
{$lang->toplinks_search}
</a>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

<a href="http://www.forum.info/index.htm"> 
<font size="4;" color="#0066CC"> Go to Location (click here)</font>
</a>
</div>


Also looking at if possible to make so <a> text links on each side be able to wrap on each other without crossing the 'space' in between ?

(02-20-2012 12:17 PM)leefish Wrote: [ -> ]You could try  this :

HTML Code
<div style="width:100%;">
<div><a href="http://www.leefish.nl/mybb/portal.php">HALLO</a></div>
<div style="float:right;margin-top:-25px;"><a href="http://www.forum.info/index.htm">goodbye</a></div>
</div>


Thank you for the suggestion !
Tried and got scrnshot attached.

Think did it per suggestion, but may have missed something ?...

Code:
<div style="width:100%;">
<div>
<a href="{$mybb->settings['bburl']}/search.php">
<img src="{$theme['imgdir']}/toplinks/search.gif" alt="" title="">
{$lang->toplinks_search}
</a>
</div>
<div style="float:right;margin-top:-25px;">
<a href="http://www.homepage.info/index.htm"> 
Return to homepage (click here)
</a>
</div>
</div>

Hmm. It looks like the default font size and also that the div is inheriting from something higher up on the page. I just ran that through FF on a page with no CSS using default browser and it behaved as expected. Are you trying for a tableless theme?

If you don't mind using tables then the default template forum display threadlist pretty much does what you are looking for - look at the default on threadlist - title on the left and subscribe to thread on the right.
(02-22-2012 03:40 AM)leefish Wrote: [ -> ]Hmm. It looks like the default font size and also that the div is inheriting from something higher up on the page. I just ran that through FF on a page with no CSS using default browser and it behaved as expected. Are you trying for a tableless theme?
If you don't mind using tables then the default template forum display threadlist pretty much does what you are looking for - look at the default on threadlist - title on the left and subscribe to thread on the right.

Thanks much !
Tables worked fine.
Just took me a while to get back to the question and learn a bit about tables.
Reference URL's