Latest Announcemnent
New thread

a little help, DIV positioning

Status
Not open for further replies.
K

kizmark

Active Member
402
2010
15
0
hello guys, I need help about my facebook buttons and Google +1.. I had make their codes to contain on my "div" and I want them to aligh right just like here on WJ..

here's the current code:

PHP: 
{$abcd}{$fbDock_block}<div id="container">
                <div  style="align:right;">
<!-- Place this tag where you want the +1 button to render -->
<g:plusone size="medium"></g:plusone>
<iframe src="http://www.facebook.com/plugins************app_id=233064246707613&amp;href=http%3A%2F%2Fwww.pinoy-warez.com&amp;send=false&amp;layout=button_count&amp;width=450&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font=arial&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe>
                        </div>


		<hr class="hidden" />
		<br class="clear" />
		<div id="content">
			{$pm_notice}{$fbdock_friend_request}
			{$bannedwarning}
			{$bbclosedwarning}
			{$unreadreports}
			{$repost}
			<navigation>
                         
			{$board_messages}

.........</div>

please see in action on my site, http://www.pinoy-warez.com
 
14 comments
<div style="align:right;">

don't do it this way, add values for your divs using css, and this will be probably floating-right:xx px ;
 
The width of the +1 (82px) is what is causing the space near to it, you can make that narrower then move them all to the right.

And then just replace the style right thing with <div align="right">, just tried editing your HTML on chrome and got a nice result.

BTW, I've always liked your website, good luck with it.
 
Try this code ....
remember copy paste the WHOLE code
PHP: 
<div style="align:right;width:250px;"> 
<!-- Place this tag where you want the +1 button to render --> 
<g:plusone size="medium"></g:plusone> 
<iframe src="http://www.facebook.com/plugins************app_id=233064246707613&amp;href=http%3A%2F%2Fwww.pinoy-warez.com&amp;send=false&amp;layout=button_count&amp;width=450&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font=arial&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe> 
                        </div>

Edit:-
can you provide me the login details so that i can add the div style in your stylesheet ? or you can do this by your own ?
assign a ID to div and add the properties in stylesheet.
 
Last edited:
pi0tr3k said:
<div style="align:right;">

don't do it this way, add values for your divs using css, and this will be probably floating-right:xx px ;
Click to expand...
tried the float-right attributes but does'nt work and effect..


Paul said:
The width of the +1 (82px) is what is causing the space near to it, you can make that narrower then move them all to the right.

And then just replace the style right thing with <div align="right">, just tried editing your HTML on chrome and got a nice result.

BTW, I've always liked your website, good luck with it.
Click to expand...

hey Paul, thanks for liking my site, you could hit the "like" button on FB though ;p


btw,
the align="right" attribute is what I've came up before posting this problem but it can't make those buttons to go on the edge. it just appear about 3/4 before right.

@warezrock
doesn't work, it make the buttons appear vertically.
 
sorry

its not align:right its float:right; :|

Edit...

decrease the size of the width to fit the need like around 100 to 130px

add one more property overflow:hidden;
 
Last edited:
Do one more thing

wrap both button in div :D
PHP: 
<div style="float:right;"><g:plusone size="medium"></g:plusone></div>
<div style="float:right;"><iframe src="http://www.facebook.com/plugins************app_id=233064246707613&amp;href=http%3A%2F%2Fwww.pinoy-warez.com&amp;send=false&amp;layout=button_count&amp;width=450&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font=arial&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe></div>

and yeah set the width of the main div around 150px;

Thanks
 
thanks warezrock, the above codes make the buttons disappear..
I did combine your first suggestion with the wrapping both div and come the best result..

That was great help. I thought I have enough knowledge on HTML and CSS, maybe I should explore and study more about it.. :)
 
Hey, you should always use style="float:right;" inside a div, so it floats to the right.
"align" attributes are not really used now-a-days.

I'm glad its fixed. :)
 
Status
Not open for further replies.
Back
Top