[英]How to put an <p> element directly after an <a> element without placing it on a new line
When I was working on my site I walked towards a problem. 当我在自己的网站上工作时,我遇到了一个问题。 I want to have the <.p> element directly after my <.a> element, so it is not a line under it.
我想在<.a>元素之后直接放置<.p>元素,因此它下没有一行。
How it is now: 现在如何:
Login
\
Register
How I want it: 我要的是:
Login \
Register
You can visit my site if you want to take a look: 如果您想看一下,可以访问我的网站:
v14rkoende.helenparkhurst.net v14rkoende.helenparkhurst.net
This is my html code: 这是我的html代码:
<div class=logreg>
<div class=logregb>
<p class=loginl ><a href=login.html class=loginr>Login</a> /</p>
<p class=loginl ><a href=register.html class=loginr>Registreer</a></p>
</div>
</div>
This is my CSS code: 这是我的CSS代码:
.loginr {
font-family: Century Gothic;
color: white;
font-size: 12px;
margin-bottom: 0px;
margin-top: 0px;
text-decoration: underline;
}
.loginl {
font-family: Century Gothic;
color: white;
font-size: 12px;
text-decoration: none;
margin: 0px;
}
.logreg {
margin-left:-20px;
}
.logregb {
width: 0px;
margin-left: auto ;
margin-right: auto ;
margin-top: -40px;
}
Thanks for helping me out 谢谢你的协助
Solution was to make the width bigger so for example: 解决方案是使宽度更大,例如:
.logregb {
width: 100px;
margin-left: auto ;
margin-right: auto ;
margin-top: -40px;
}
Thanks to all people for the fast awnsers! 感谢所有人的快速遮阳篷!
try this (UNTESTED) : 试试这个(未测试) :
.loginl a {
float:left;
}
The width of your parent DOM element is to small. 您的父DOM元素的宽度很小。 Remove the
.logregb {width: 0px;}
because it results in 2 line breaks. 删除
.logregb {width: 0px;}
因为它会导致2个换行符。
Alternatively 或者
Add nowrap
to your CSS as following: 将
nowrap
添加到CSS如下:
.loginl {
[...]
white-space: nowrap;
}
Here is the JSFiddle: http://jsfiddle.net/j3t47pqg/1/ 这是JSFiddle: http : //jsfiddle.net/j3t47pqg/1/
pa { display:inline-block; }
<div class=logreg> <div class=logregb> <p class=loginl > <a href=login.html class=loginr>Login</a> <a href=register.html class=loginr>Registreer</a> </p> </div> </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.