請問我怎樣才能得到正確的間距？

Question

我不是最擅長 HTML，但我也不是最差的，因為我知道如何使用指令定位和更改內容，但僅此而已。

有人能幫我嗎？

我試圖將這兩個菜單分開/隔開，最好是左側的主菜單鏈接和右側的社交媒體鏈接，我在下面包含了兩張圖片，希望能解釋我想要實現的目標。

這是它在我網站上的樣子

這就是我想要的樣子

希望我在下面放置了正確的代碼，因為我最初說我根本不擅長 HTML。

# 7. Navigation
-----------------------------------------------*/
#social-menu .social-links a {
color: $(topmenu.text.color);
}
#social-menu .social-links a:hover {
color: $(topmenu.text.hover.color);
}
.menu-wrap {
font-family: 'Poppins', sans-serif;
font-weight: 400;
font-size: 12px;
text-transform: uppercase;
letter-spacing: 2px;
width: 100%;
z-index: 7;
word-break: break-word !important;
-webkit-font-smoothing: subpixel-antialiased;
text-align: center;
}
#menu-secondary {
max-width: 1180px;
margin: 0 auto;
border-top: 1px solid;
border-bottom: 1px solid;
}
#nav-secondary {
margin-bottom: 50px;
}

#nav-primary {
position: static;
height: 50px;
background: $(topmenu.bg.color);
}

.wrapper-nav-primary {
max-width: 92%;
margin: 0 auto;
position: fixed;
width: 100%;
background: $(topmenu.bg.color);
padding: 0 4%;
z-index: 999;
}

#menu-primary {
width: 70%;
float: left;
visibility: hidden;
}

#social-menu {
float: right;
margin-top: 18px;
}
.menu-wrap .widget {
display: inline-block;
}

.menu-wrap li {
display: inline-block;
position: relative;
}

.menu-wrap li,
.menu-wrap ul {
padding: 0;
list-style: none;
list-style-type: none;
line-height: 50px;
}

.menu-wrap li a {
margin: 0 30px;
font-weight: 400 !important;
}

#nav-primary li a {
color: $(topmenu.text.color);
}

#nav-primary li a:hover {
color: $(topmenu.text.hover.color);
}

先感謝您。

Answer 1

我的猜測是您可以將以下內容添加到#social-menu。 如果您可以提供 HTML 實現，而不僅僅是 CSS，它將更容易確定。

  position: absolute;
  right: 0px;

Answer 2

再次感謝你們的幫助，我覺得很傻，因為解決方案只是轉到 Blogger 布局部分並簡單地移動一個框！

我花了昨天的整個時間試圖對此進行排序，遵循各種教程和指南來更改 HTML 並添加 CSS 哈哈。

主菜單部分的紅色 HTML/JavaScript 框應位於下方的社交媒體部分