所以我是 html 的新手，不像字面意义上的刚开始，但绝对算不上高级: 假设你已经阅读了标题，这是我的 html 代码
window.twttr = (function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0],
t = window.twttr || {};
if (d.getElementById(id)) return t;
js = d.createElement(s);
js.id = id;
js.src = "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
t._e = [];
t.ready = function(f) {
t._e.push(f);
};
return t;
}(document, "script", "twitter-wjs"));.socialButton {
visibility: hidden;
}
.tooltip {
display: inline-block;
border-bottom: 1px dotted black;
}
.tooltip .tooltiptext {
visibility: hidden;
width: 120px;
background-color: black;
color: #fff;
text-align: center;
padding: 5px 0;
border-radius: 6px;
position: absolute;
z-index: 1;
}
.tooltip:hover .tooltiptext {
visibility: visible;
}
center {
left: 220px;
}
.vertical-menu {
width: 200px;
height: 100%;
position: fixed;
top: 10px;
left: 10px;
margin-bottom: 30px;
z-index: 1;
}
.vertical-menu a {
background-color: #eee;
color: black;
display: block;
pading: 12px;
text-decoration: none;
z-index: 2;
}
.vertical-menu a:hover {
background-color: #ccc;
z-index: 2;
}
.vertical-menu a.active {
background-color: #4CAF50;
color: white;
z-index: 2;
}
html {
height: 100%;
text-indent: 2.0em;
position: relative;
left: 220px;
margin-right: 220px;
text-indent: 2.0em;
}
a {
color: blue;
text-shadow: 0px 0px black;
text-decoration: none;
}
body {
background-color: #72b368;
color: white;
text-shadow: 2px 2px black;
font-size: 18;
text-indent: 2.0em;
height: 100%;
margin: 0;
}
head {
background-color: #72b368;
color: orange;
text-shadow: 2px 2px black;
font-size: 18;
}
footer {
background-color: black;
color: darkred;
font-size: 12;
height: 20;
text-indent: 0em;
margin: 0;
position: relative;
left: -220px;
right: 220px;
margin-right: -220px;
text-align: right;
padding-right: 10px;
padding-top: 4px;
}
h1 {
color: white;
text-shadow: 2px 2px black;
font-size: 22;
}
h2 {
color: white;
text-shadow: 2px 2px black;
font-size: 26;
}
h3 {
color: orange;
text-shadow: 2px 2px black;
font-size: 26;
}
h4 {
color: white;
text-shadow: 2px 2px black;
font-size: 30;
}
h5 {
color: white;
text-shadow: 2px 2px black;
font-size: 34;
}
h6 {
color: white;
text-shadow: 2px 2px black;
font-size: 38;
}<center>
<!--Header Title-->
<h3>Insert Meaningless Contact Here</h3>
</center>
<b></b>
<p>Welcome to a meaningless contact page, with meaningless contacts on it, where you can contact the meaningless creature known as me.</p>
<!--Yes this is a joke-->
<div class="vertical-menu">
<!--Side menu-->
<a href="Page.html">Home</a>
<a href="#" class="active">Contact Me</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
<a href="#">Link 6</a>
<a href="#">Link 7</a>
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
<a href="#">Link 6</a>
<a href="#">Link 7</a>
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
<a href="#">Link 6</a>
<a href="#">Link 7</a>
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
<a href="#">Link 6</a>
<a href="#">Link 7</a>
</div>
<div class="pusher">
<!--Actual <body> content-->
<hr></hr>
<a class="twitter-follow-button socialButton" href="https://twitter.com/TwitterDev">Follow @TwitterDev</a>
<br></br>
<center>
<a class="twitter-timeline" href="https://twitter.com/TwitterDev" data-width="750" data-height="400">Tweets by TwitterDev</a>
</center>
<center>
<!--More Content-->
<h2>More content coming soon.</h2>
<h1>(Always trying to add more stuff.)</h1>
</center>
<null>
<!--Page breaks for footer-->
<br></br>
<br></br>
<br></br>
<br></br>
<br></br>
<br></br>
</null>
</div>
<footer>
<!--Copyright and other shit-->
Site design by Matthew Rease. (c) 2017. Do not copy custom design without permission. To contact me, go to my YouTube channel listed above, and use the contact information there.
</footer>抱歉太长了，我只是想展示一下以防万一。 我做了一些研究，但有一半时间我不明白别人在说什么，而另一半(当我这样做时)他们的解决方案不起作用。 我真的无法再用文字来解释我的结果了，但这是我“photoshopped”的例子 http://imgur.com/a/EqD8X 显然它不一定在同一个地方，但我只是举个例子。
在你指出 .socialButton 只是让它不可见之前(尽管这也行不通)这是一个测试，基本上我无法在 .socialbutton {} block 中运行任何东西，我'我们已经尝试了一些显而易见的事情，比如 right: align-text: align-content: 和 what-not 但显然问题是让类(class)应用这些特征 它应该使用类的 twitter-follow-button，然后是我制作的名为 socialButton 的按钮。
有什么想法吗？建议？感谢所有帮助。
最佳答案
试试下面的代码。您可以添加带分隔符的 anchor 标记，然后将其右对齐。
<div align = "right"><a class="twitter-follow-button socialButton" href="https://twitter.com/TwitterDev">Follow @TwitterDev</a><div>
关于html - 将嵌入的推特关注按钮放置在页面右侧，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42663504/