2016-05-20 16 views
0

このCSSのコードを作成するにはどうすればよいですか?CSSのプロパティ(本文の幅)= HTMLタグの属性(テーブルの幅)

body { 
width: $table.width(); 
} 

私はこれを行う簡単/簡単な方法を見つけることができません。

私はテーブルがあり、そのテーブルの幅は巨大ですが、私は手動で入力したくないのですがxxxxx px、それは自動的にそのテーブルのボディの幅を変更します。私は幅を変更しない場合、テーブルのヘッダーは、列/幅を減らすために、より多くの行/高さを取得するので、ヘッダーが常に追加され、ボディにフィットします。

私は他のCSSプリプロセッサについて知っていますが、私は本当にこれを行う方法を知りたいと思います。

P .:私は現在http://codepen.io/penを使用しています。

編集:私には解決策が見つかりませんでした。私はそれが投稿されるとは思わないので、実際の解決策を除いて、もっと多くの投稿は必要ありません(主に質問)。しかし、投稿されていない限り誰でも投稿することができます。

+0

体内の唯一の要素のテーブルです?? –

+0

はい、多くのヘッダーとセルがありますが、はいです。 –

+0

私の答えがあなたに役立つかどうか教えてください –

答えて

-1

あなたはAJAXで関数を呼び出すと、スタイルの値を含め、その後

var width = document.getElementById('table').style.offsethwidth;

テーブルの現在の幅を抽出するためにJavaScriptを使用する必要があります。しかし、あなたが幅を抽出することができるようにするに<table width="$width"</table>

を使用する必要があります、あなたは変数を呼び出すためにGETを使用する必要があります。したがって、あなたがしたいことは技術的に可能ではありません。これが実行されていることがわかる唯一の方法です。

+0

:-) - しかし、私はそれを回すでしょう: 'table {width:100%; } ' – Johannes

+0

私が探しているのはそれではありません。もう一度お読みください... –

+0

@ Mr.Guy表は本文の子要素です。あなたが求めていることをするのは不可能です。 – Johannes

0

私は個人的にdiv内にテーブルを配置します。

そうすれば、あなたは、ページ幅、またはピクセルのいずれかの指定された量/ページ幅の割合であることをdiv要素の幅のスタイルを設定した後、100%にテーブルの幅を設定することができます。これは、あなたのビューのポートステートメントがデバイスの幅に設定されていることを前提としています。

HTML:

<div class = 'container'> 
    <table class = 'tab'> 
</div> 

はCSS:

.container{ 
    width = 1200px 
} 

.tab{ 
    width = 100% 
} 
0

私はそれが自動的にここではそのテーブルと同じ

に体の幅を変更したいが私ですソリューション、純粋なCSS

body { 
 
    width: auto; 
 
    height: auto; 
 
    border: 2px solid red; 
 
    display: inline-block; 
 
} 
 

 
table { 
 
    width: 100px; 
 
    height: 100px; 
 
}
<body> 
 
    <table> 
 

 
    </table> 
 
</body>

関連する問題