水平对齐div中的3个按钮

发布于 2024-12-07 23:34:50 字数 816 浏览 0 评论 0原文

如何在 xhtml 中水平对齐这 3 个按钮?顺便说一下,这是给博主的。

这是我的按钮 xhtml:

<div class='fb-like'>
<fb:like action='like' expr:href='data:post.url' font='arial' layout='button_count' send='true' show_faces='true' width='450'/>
</div>

<div><b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<g:plusone annotation='inline' width='450' expr:href='data:post.url'></g:plusone>
</b:if></div>

<div><b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<a class='twitter-share-button' data-count='none' data-via='MarvinVista' expr:data-text='&quot;Currently reading: &quot; + data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share'>Tweet</a>
</b:if></div>

How can I align this 3 buttons horizontally in xhtml? This is for blogger by the way.

Here's my xhtml for the buttons:

<div class='fb-like'>
<fb:like action='like' expr:href='data:post.url' font='arial' layout='button_count' send='true' show_faces='true' width='450'/>
</div>

<div><b:if cond='data:blog.pageType != "static_page"'>
<g:plusone annotation='inline' width='450' expr:href='data:post.url'></g:plusone>
</b:if></div>

<div><b:if cond='data:blog.pageType != "static_page"'>
<a class='twitter-share-button' data-count='none' data-via='MarvinVista' expr:data-text='"Currently reading: " + data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share'>Tweet</a>
</b:if></div>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

倾城泪 2024-12-14 23:34:50

您可以将它们放置在一个包含的 div 中,为每个 div 指定一个设定的宽度,然后将它们浮动到左侧。

You can place them in a containing div, give each div a set width and then float them to the left.

余罪 2024-12-14 23:34:50

HTMLCSS

<div class='fb-like share-button'>
<fb:like action='like' expr:href='data:post.url' font='arial' layout='button_count' send='true' show_faces='true' width='450'/>
</div>

<div class="share-button"><b:if cond='data:blog.pageType != "static_page"'>
<g:plusone annotation='inline' width='450' expr:href='data:post.url'></g:plusone>
</b:if></div>

<div class="share-button"><b:if cond='data:blog.pageType != "static_page"'>
<a class='twitter-share-button' data-count='none' data-via='MarvinVista' expr:data-text='"Currently reading: " + data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share'>Tweet</a>
</b:if></div>

.share-button{display:inline-block;}

HTML

<div class='fb-like share-button'>
<fb:like action='like' expr:href='data:post.url' font='arial' layout='button_count' send='true' show_faces='true' width='450'/>
</div>

<div class="share-button"><b:if cond='data:blog.pageType != "static_page"'>
<g:plusone annotation='inline' width='450' expr:href='data:post.url'></g:plusone>
</b:if></div>

<div class="share-button"><b:if cond='data:blog.pageType != "static_page"'>
<a class='twitter-share-button' data-count='none' data-via='MarvinVista' expr:data-text='"Currently reading: " + data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share'>Tweet</a>
</b:if></div>

CSS

.share-button{display:inline-block;}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文