問題タブ [css]

Firefox 3 にアップグレードする前は、ソース HTML を非常に整理されたグラフィカルな形式で表示するView Source Chart Firefox アドオンを常に使用していました。残念ながら、このアドオンは Firefox 2 専用であり、Firefox 3 のベータ版は著者のサイトで現在 10 ドルで販売されています。

Firefox 3 で動作する同様のアドオンを知っている人はいますか?

(もちろん、実際にこれに $10 を支払うかもしれませんが、Firefox 2 のバージョンには制限があり、何かに $10 を払いたくないので、最初にもっと良い無料のものがないかどうかを尋ねたいと思います。課金する前にテストできないベータ版です。)

で表される要素を持つ水平メニューを作成しようとしています<span>。メニュー自体 (parent <div>) の幅は固定ですが、要素数は常に異なります。

<span>子の数に関係なく、同じ幅の子を持ちたいと思います。

これまでに行ったこと：float: left;すべてのスパンにスタイルを追加し、そのパーセンテージ幅を指定しました（サーバーはページ生成時にメニュー項目がいくつあり、100％を分割できるかを知っているため、パーセンテージは多かれ少なかれ問題ありませんこの番号で）。これは機能しますが、除算の余り (3 つの要素の場合など) がある場合を除きます。この場合、parent の右側に 1 ピクセルの穴があり<div>、パーセントを切り上げると、最後のメニュー要素は次のようになります。包まれた。また、その場でスタイルを生成するのはあまり好きではありませんが、他に解決策がない場合は問題ありません。

他に何を試すことができますか？

これは非常に一般的な問題のようですが、「同じ幅の子要素」をグーグルで調べても役に立ちませんでした。

デザインをきちんと学んだことのない（または才能がない）人の一人として、デザインはいつも私を阻んでいるステップのようです。標準のGUIツールキットは見栄えの良いインターフェイスを設計するためのいくつかの許容可能な方法を提供するため、リッチクライアントにとっては問題ではありませんが、Webは別の話です。

質問：Webアプリケーションのインターフェースを設計するための高品質のフレームワークを知っている人はいますか？適切なコントロールのセット（標準のhtmlコントロールに加えて、ナビゲーション、リスト、フォームなど）とスタイルシートを使用して、許容できるモダンな外観を実現するためのhtmlの標準スニペットを考えています。そのようなものが存在する場合、それはワードプレス、drupalなどがそれを許可する方法でテーマをサポートすることさえできます。

私はyahooyuiを知っていますが、グリッドcssは正しい方向への一歩ですが、それはほとんどjavascriptです。

重複の可能性：
CSSで繰り返される定数を回避する

CSSシートで再利用される「テーマカラー」がいくつかあります。

変数を設定して再利用する方法はありますか？

例えば

私は、PC と Mac のすべてのブラウザーで見栄えがよく、かなり標準に準拠した XHTML+CSS サイトを持っています。先日、Linux の FF3 でそれを見たところ、文字間隔がわずかに大きく、すべてがおかしくなり、テキストの不要な折り返しやクリッピングが発生しました。問題のCSSには

それが何にマッピングされていても、それが一般的なサンセリフで起こっていることは知っています。以下を追加すると、テキストは他のプラットフォームで得られるものに近くなるように縮みます。

しかし、これには厄介なサーバー側の OS スニッフィングが含まれます。これに対する純粋な CSS ソリューションがあれば、それを聞きたいです。

問題のシステムは Ubuntu 7.04 ですが、Linux ユーザーのすべてではないにしても、少なくとも大多数のために修正しようとしているので、これは関係ありません。もちろん、ユーザーにフォントのインストールを求めることはできません!

Html Textarea 要素は、スペースまたはタブ文字に達したときにのみ折り返されます。ユーザーが looooooooooooooooooong の十分な単語を入力するまで、これは問題ありません。改行を厳密に強制する方法を探しています (例: "loooooooooooo \n ooooooooooong" になっても)。

私が見つけた最善の方法は、すべての文字の後にゼロ幅の Unicode スペースを追加することですが、これによりコピーと貼り付けの操作が中断されます。誰かがより良い方法を知っていますか?

注: ここでは "textarea" 要素 (つまり、テキスト入力と同じように動作するもの) を参照しています。単純な古いテキスト ブロックだけではありません。

私はRailsプログラミングの初心者で、ページに多くの画像を表示しようとしています。一部の画像は他の画像の上に配置されます。簡単にするために、青い正方形の右上隅に赤い正方形がある青い正方形が必要だとします（ただし、隅にはきつくありません）。パフォーマンスの問題のため、（ImageMagickなどを使用した）合成を回避しようとしています。

重なり合う画像を相互に相対的に配置したいだけです。

より難しい例として、より大きな画像の中に走行距離計を配置することを想像してください。6桁の場合、100万の異なる画像を合成するか、すべてをオンザフライで行う必要があります。必要なのは、6つの画像を他の画像の上に配置することだけです。

コントロールを実際にラベルに置き換えることなく、asp.netハイパーリンクコントロールがリンクするのを防ぐことはできますか?つまり、ラベルとして表示されるようにすることはできますか? 多分CSSを使用するか、属性を設定しますか？

無効にすると機能することはわかっていますが、表示が異なります（グレー表示されます）。

私の主張を明確にするために、ページの上部に、ユーザー コントロールを使用して動的に作成されたユーザー名のリストがあります。ほとんどの場合、これらの名前は電子メール ページにリンクできます。ただし、ユーザーが無効になっている場合、名前は灰色で表示されますが、現在はまだ電子メール ページにリンクされています。これらの無効なユーザーがリンクしないようにします。

私は実際にそれらをラベルに置き換える必要があることを知っていますが、これは CSS を使用してリンク機能を削除するほどエレガントではないようです (可能であれば)。それらはすでに別の色で表示されているため、無効なユーザーであることは明らかです。リンクを切るしかない。

Firefox、IE6、および IE7 で動作する HTML のコンテンツを垂直方向および水平方向に中央揃えするための実用的なソリューションは何ですか?

いくつかの詳細:

• ページ全体の解決策を探しています。

• 中央に配置する要素の幅のみを指定する必要があります。要素の高さは設計時にはわかりません。

• ウィンドウを最小化すると、すべての空白がなくなったときにのみスクロールが表示されます。つまり、画面の幅は次のように表す必要があります。

"leftSpace width=(screenWidth-widthOfCenteredElement)/2"+
"centeredElement width=widthOfCenteredElement"+
"rightSpace width=(screenWidth-widthOfCenteredElement)/2"

高さについても同じです。

"topSpace height=(screenHeight-heightOfCenteredElement)/2"+
"centeredElement height=heightOfCenteredElement"+
"bottomSpace height=(screenWidth-heightOfCenteredElement)/2"

• 実際には、テーブルの使用は問題ありません。このレイアウトは、主にログインなどの特別なページに使用する予定です。したがって、CSS の純度はここではそれほど重要ではありませんが、将来の互換性のために標準に従うことが望ましいです。

CSS 属性セレクターを使用すると、属性値に基づいて要素を選択できます。残念ながら、私は何年もそれらを使用していません (主な理由は、最新のすべてのブラウザーでサポートされていないためです)。ただし、次のようなコードを使用して、すべての外部リンクをアイコンで装飾するためにそれらを使用できたことをはっきりと覚えています。

上記のコードは機能しません。私の質問は次のとおりです。どのように機能しますか? 属性が で始まるすべての<a>タグを選択するにはどうすればよいですか? 公式の CSS 仕様 (上記のリンク) では、これが可能であるとは言及されていません。しかし、私はこれをしたことを覚えています。href"http"

(注: 明らかな解決策はclass、区別のために属性を使用することです。私は HTML コードの作成方法にほとんど影響を与えないため、これを避けたいと考えています。私が編集できるのは CSS コードだけです。)