我要回覆

PenYin

131分

樓主

PenYin

個人積分：131分

文章編號：54963395

[已解決][css]文字於 div 內對齊問題

如果我 div 設定固定寬度，並且文字不換行的話，會變成下圖這樣
[已解決][css]文字於 div 內對齊問題

但我希望能呈現效果如下圖，不知道有沒有辦法達到呢？
[已解決][css]文字於 div 內對齊問題

想請教各位高手們... 滾來滾去

--------------------------- 以下已試出方法

<style type="text/css">
#container{
position: absolute;
overflow: hidden;
text-align: center;
height: 26px;
}
#mydiv{
margin: 0 auto;
width: 60px;
height: 20px;
border: 3px solid #000;
}
#content{
margin-top: -20px;
}
</style>

<body>
<-div id="container">
<-div id="myDiv"><-/div>
<-div id="content">1234567890123<-/div>
<-/div>
</body>

2015-03-20 16:05 #1

文章關鍵字

div css 問題文字

workingman

0分

2樓

workingman

個人積分：0分

文章編號：54983275

您好，有個不太聰明的方法提供您參考～如下
---------------------------------------------------------------------
<style type="text/css">
html,body{
margin:0px;
}
#container{
width:110px;
height:35px;
margin-left:100px;
margin-top:100px;
}
#myDiv{
width:50px;
height:25px;
/*background-color:silver;*/
border:#000 solid 5px;
position:absolute;
margin-left:25px;
}
#content{
width:110px;
height:35px;
/*background-color:orange;*/
text-align:center;
line-height:35px;
font-family:"微軟正黑體";
}
</style>
</head>

<body>
<-div id="container">
<-div id="myDiv"><-/div>
<-div id="content">12345678910<-/div>
<-/div>
</body>
(請再把每個div內的"-"刪除即可)
---------------------------------------------------------------------

PenYin

131分

樓主

PenYin

個人積分：131分

文章編號：54986613

workingman wrote:
您好，有個不太聰明的...(恕刪)

感謝，這方法我有做過，可是問題是內文「12345678910」是不可知的...

我剛突然想到一個做法，我先試試看，成功來分享一下

PenYin

131分

樓主

PenYin

個人積分：131分

文章編號：54986687

試出來了～～～～

<style type="text/css">
#container{
position: absolute;
overflow: hidden;
text-align: center;
height: 26px;
}
#mydiv{
margin: 0 auto;
width: 60px;
height: 20px;
border: 3px solid #000;
}
#content{
margin-top: -20px;
}
</style>

<body>
<-div id="container">
<-div id="myDiv"><-/div>
<-div id="content">1234567890123<-/div>
<-/div>
</body>

[已解決][css]文字於 div 內對齊問題

小惡魔新聞台

今日熱門文章 網友點擊推薦！

今日熱門文章　網友點擊推薦！