Wordpressのレスポンシブな要素

Question

こんにちは私は問題があり、実際にいくつかの助けを使用することができます。

私はWordpress用のVisual Composerと無料のSpaciousテーマを使用してサイトを構築しています。カスタムCSSを使用してnavbar、fbロゴ、パンフレット/ pdfアイコンを移動しました。

はFBとパンフレット/ PDFアイコンは、ページの下部にある2つの生のHTML要素であり、私は彼らのクラスを与え、CSS

を使用して手動ですべての要素、ナビゲーションバー、FBのロゴ、PDFロゴ、製品カテゴリのタイトルを移動

しかし、画面を拡大または縮小したり、どこか別の場所にジャンプした画像のドロップダウンにカーソルを合わせると、誰かがどのように反応してすべての画面サイズでうまく見えるようにすることができますか？

誰か簡単な方法を知っていますか？私はそれらの場所でそれらを得るための他の方法を知らなかった。

サイト：http://www.corebusinesssa.co.za/Test/

編集：ドロップダウン解決ではなく、縮小画面の一部

相続人は私のcss

.main-navigation { 
padding-right; 5px; 
} 
.main-navigation a { 
color: black; 
position: relative; 
top: -35px; 
right: 200px; 
} 

.fbicon { 
position:relative; 
top: -845px; 
right: -1200px; 
} 

.pdficon { 
position:relative; 
top: -695px; 
right: -1190px; 
} 

.pdficontext { 
position:relative; 
top: -650px; 
right: -1070px; 
color: #0e4776; 
font-weight: bold; 
} 

.contactusheader { 
position:relative; 
top: -980px; 
} 

.productcategoriestitle { 
position: relative; 
top: 50px; 
} 

Answer 1

ドロップダウンメニューの相対位置しているので、彼らは混乱レイアップを彼らが出現するときに - アウト。

絶対にすると、他の要素は影響を受けません。

したがって、ドロップダウンの位置を変更できます。フッタの上に表示するには、広告zインデックスを使用します。

.dropdown-content 
{ 
    position: absolute; 
    z-index: 1; 
}