2

レスポンシブ フレームワークを使用するのはこれが初めてです...また、レスポンシブ サイトを構築するのは一般的にかなり新しいですが、ゼロから構築して各要素のサイズを調整するだけで、より多くの運がありました...頭をつかむことができれば、より良い解決策です！

進行中の作業はこちら: http://client.analog.la/360/

メニューの問題を除いて、デスクトップ ブラウザー (400 にサイズ変更) で「問題なく」動作しています。問題は、メニューをロゴの下にドロップダウンさせ、適切に中央に配置しようとすることです。

実際のモバイルとタブレットでは、さらに多くの問題があります...メニューがレイアウト全体の上または片側にあり、まったくドロップダウンしていません。iPad では、レイアウト全体が約 95% のページ幅しかなく、右側にランダムな余白があるように見えます... iPhone では、レイアウト全体が約 50% の幅しかないように見えます...これはひどいものです。レイアウトがデバイス上でどのように見えるか、デスクトップ上で同じ解像度でどのように見えるかの間には非常に多くの不一致があるので、少し困惑しています...また、サイズ変更のどこで間違って見えたのか本当にわかりませんデバイスで！

どんな助けでも大歓迎です！

ありがとう、

4

1 に答える 1

0

これについてまだヘルプを探しているかどうかはわかりませんが、コードベースには多くの問題があり、どの問題が対処しようとしている動作を引き起こしているのかを判断するのは困難です. 最初にクラスをdiv使用しますが、 .columnsにネストされていませんrow。他の場所では、他の行にすぐにネストされた行があり、明らかな利点はなく、挿入することなく他の行にさらにcolumnsネストされ、折りたたみに設定されていないネストされています。あなたはいくつかの場所でも使用していて、私はほとんど涙を流しました.columnsrowrowsspacer.png

また、最上位のヘッダーspansはh1. ここでの私の唯一の推測は、Foundation のデフォルト スタイルを回避しようとしていたということですか? クラスを使用します。h1これらは、SEO、セマンティクスなどに必要です。

侮辱するつもりはありませんが、 Treehouseをチェックしてコーディング スキルを磨くのは良いことかもしれません。将来の作業で多くの時間とフラストレーションを節約できます。

于 2013-10-23T16:08:35.810 に答える