vertical-alignment

    0熱度

    2回答

    我正在嘗試在右側創建一個標題欄,右側是水平導航,如往常一樣。我需要導航項目垂直居中到徽標。 我已經嘗試了幾種方法。如果有人能夠向我展示解決方法並解釋它爲什麼起作用以及我可能錯過了什麼,我將不勝感激。 body { max-width: 995px; margin: 0 auto; padding: 20px 0; box-sizing: bo

    0熱度

    1回答

    我有一張帶有3列的表格,其中包含庫中的照片。右列和左列是箭頭。我想讓箭頭垂直放置在高度的中間,但是在大屏幕中,我希望將箭頭的頂部邊距限制在距離桌子頂部不超過80像素的位置。我想我正在尋找像「最大利潤率」這樣的東西!但我無法通過純CSS來處理它。 <table style="width:100%"> <tr> <td style="width:60px;vertical-align:mi

    0熱度

    1回答

    我有一個div,它使用background-image屬性和background-size設置爲cover。在包含背景圖像的<div>之內,我有一個<div>,其中包含一個文本塊和一個包含圖像的<div>。 我想在背景圖像中垂直對齊兩個<div> s。 我有代碼(下面),它們相互垂直對齊<div>,但不在背景圖像中。我知道我的代碼不起作用,因爲垂直對齊需要在bg課程級別發生,但我無法弄清楚如何使其

    1熱度

    2回答

    我在同一時間範圍內有一個帶有文本的SVG文件。文字和SVG的高度相同。但是,SVG與文本不在同一行。 相關的jsfiddle:https://jsfiddle.net/tcrnjd53/ 正如你所看到的,Facebook的標識必須是在紅色虛線,就像示例文本。 span { font-size: 1em; border-bottom: 1px dotted red;

    1熱度

    1回答

    所以我一直在爲這兩週的更好的一半工作,似乎無法按預期得到這個工作。我開始認爲這可能是問題中的行/列有多深,但真的想獲得一些外部洞察力。 簡而言之,它是包含 - > 2行的頁面,其中第二行包含 - > 2列,其中第二行包含 - > 3行是麪包屑,每個頁面的主要內容和頁腳。如果頁面需要擴展導航應保持靜態。我隱約記得,當開始看到一些人試圖做類似的佈局,但一直沒能找到那些帖子。 下面是爲剝離下來的一個形式

    0熱度

    1回答

    我在垂直和水平方向上居中放置一個表單,我已經設置了水平居中表單,但無法設置垂直居中而不導致表單和圖像重疊。在頁面底部還有多個圖片橫向居中的問題。 .banner { position: relative; width: 100%; top: 0; left: 0; padding: 0; margin: 0;

    0熱度

    1回答

    我有這個浮動圖像,我想在flex-navbar的左邊。佈局應該是響應式的,圖像垂直對齊中間(垂直對齊:中間;不起作用)。 在此先感謝! https://jsfiddle.net/wonrpfsc/ <div class="container"> <a href="#"><img id="logo" src="http://brandmark.io/logo-rank/random/ap

    -1熱度

    1回答

    我有一個inline-flex元素由兩個內嵌塊元素結束。他們都是不同的高度,但我想把他們與他們的垂直中心。 在webkit中,通過將position: relative; top: 53px;應用於內嵌塊元素,可以實現這一點。但是,在Firefox中,這將內聯塊的方式放在我想要的地方。 刪除top偏移量我可以看到,webkit和firefox中元素的默認位置完全不同。 這裏有一個小提琴:https

    2熱度

    4回答

    我試圖垂直集中flex盒元素中的純文本。 我決定使用屬性display:table-cell與vertical-align: middle。但它似乎不能在Flexbox元素中正常工作。 我怎樣才能垂直集中它,理想情況下不使用包裝或定位,並仍然用橢圓截斷長文本? .container { width: 400px; height: 400px; font-w

    0熱度

    1回答

    我想讓這些div內的圖像和文字都垂直居中。我得到img與top: 0; bottom: 0; margin: auto;一起工作。然後,我試圖通過將line-height和height設置爲與容器相同的高度來垂直對齊文本,但是它不能很好地居中,它已經關閉了一定量。 我該如何得到這個工作? <div class="border" style="border:1px solid red; width: