padding-rightがfirefox以外効かない、WordPress contactform7のエラーメッセージではみ出す

Question

2つ分からない点がありご質問させていただきます。

解決したいwebサイト
http://aconnect.org/

検証ブラウザ
firefox,chrome,ie,edge(最新ver)

1つ目   (((解決済み)))
 ・padding-rightがfirefox以外効かない
 
 左サイドにクリックで開くcontentsがあるのですが、タブのテキストの位置がfirefox以外効かず困っております。
 中央に来てほしいと思っています。
 
 ![firefox](7d6532adce65304bddfc708d77ca4bf3.png)　firefox　理想通り
 ![以外のブラウザ](641b40c63607e3c7827242796f8d4245.png)　以外のブラウザ　　右寄り

 
 ===試したこと===
css
 値を変更、margin、transrate(-50%...　など
 
 出来ればハックでそれぞれ変えずにできないかと探しております。

解決方法（後程まとめて記載します）

.aboutUs span:nth-child(1) {
  display: inline-block;
}

hoverでテキストが変わる様にしていたので、display: none;をvisibility: hidden;に変更

##2つ目 未解決
WordPressのcf7を使用しており（最下部section）、承認確認チェックボックスを設けているのですが
チェックを入れてエラーメッセージが出ると、とどうしてもsectionからはみ出すような形になってしまいます。
heightの値や充てるclassを変えてみたりしたのですが

チェックをしたときに一緒にbackground―colorも伸びる？様にしたいのですが、cssのみでは難しいのでしょうか？

足りない情報ございましたらお申し付けください。
宜しくお願い致します。

Comments

[m.ts10806]

「WordPress」タグを追加してください。
WordPress本体やプラグインなどで影響することもままあるはずです

[退会済みユーザー]

ご指摘ありがとうございます。
只今追加いたしました。
尚現在のテーマはオリジナルの子テーマです。

1番目については、firefoxのみが表示されているので記述ミスかと思い
codepenで同じソースを試しましたが問題なく表示できました。

現在もwebで解決法ないか調べております。

[cerfweb]

問題部分のhtmlコードとcssがどうなっているか追記していただけますか。

[kei344]

まだ質問が「受付中」になっていますが、「ベストアンサー」を選び「解決済」にされてはいかがでしょうか。また、解決されていないなら状況を質問文に追記ください。

[退会済みユーザー]

いつもご指摘駅ありがとうございます。
未解決が分かるように書き換えいたしました。

[退会済みユーザー]

２種類の質問を一つの質問でいないでください。
未解決の質問は別の質問として切り出して下さい

[退会済みユーザー]

申し訳ありませんでした。
解決済みとして処理いたします。

Answer 1

とりあえず一つ目

.aboutUs span:nth-child(1) {
  display: inline-block;
}

これ追加したら全ブラウザで同じ表示になるはずなので、padding-rightの数値を調整してください

Comments

[退会済みユーザー]

ありがとうございます！
無事ブラウザ対応できました。

こんな初歩を見落としていたとは、恐縮です。
hover動作でdisplay:noneを指定していたので、

visibility: hidden;
visibility: visible;

で対応できました。