freoで幅可変の2カラムのスキンを作るには | Web Liberty&freoカスタマイズ集

ユーティリティ

2018年11月

カテゴリー

タグクラウド

キーワード検索

ページ

リンク

ユーザー

新着画像

新着/更新エントリー

freo用markItUp!拡張版の配布: 2018/06/10 14:01
freoのエントリーのタグ投稿を楽にする方法: 2018/05/12 10:28
freoのエントリーとページの編集画面で添付ファイルとイメージの画像を表示する方法: 2018/03/16 14:38
freoのエントリーとページの編集画面でオプションの画像を表示する方法: 2018/03/16 14:28
freoのエントリーとページの管理画面に閲覧制限情報を表示する: 2018/02/09 11:24

新着コメント

Re:freo用markItUp!拡張版の配布: 2018/06/10 from ccc
Re:freo用markItUp!拡張版の配布: 2018/06/07 from kota
Re:freoでHighslide JSを導入するには（基本編）: 2018/03/24 from ccc
Re:freoでHighslide JSを導入するには（基本編）: 2018/03/20 from うにっこ
Re:freoでHighslide JSを導入するには（基本編）: 2018/03/19 from うにっこ

過去ログ

人気コンテンツ

ブログパーツ

Twitter: @cccabinet からのツイート
Twilogを見る

Feed

エントリー

freoで幅可変の2カラムのスキンを作るには

2010/06/05 15:06
カテゴリー：カスタムテンプレート
タグ：freoCSS, freoテンプレート

表示のサンプルはこちら

templates/internals/default/default.html と templates/internals/view/default.html を開き、下から2行目にある
```
{include file='utility.html'}
```
を1行目の
```
{include file='header.html'}
```
の下に移動します。
css/default.css のうち
- 全体 ⇒ div#container の
```
width: 760px;
```
  を削除します。
- 内容 ⇒ div#content の
```
float: left;
```
  と
```
width: 550px;
```
  を削除し、
```
margin-right: 210px ;
```
  を追加します（左側にユーティリティが来る場合は margin-left: 210px ; にします）。
- エントリー ⇒ div#entry div.entry の
```
width: 550px;
```
  を削除します。
- ユーティリティ ⇒ div#utility の
```
float: left;
```
  の部分を
```
float: right;
```
  にし、
```
margin-left: 10px;
```
  を削除します（左側にユーティリティが来る場合は float: left;のままに）。
- IE6用設定 ⇒ * html div#container の
```
width: 800px;
```
  を削除します。

ページ移動

関連エントリー

コメント

コメントはまだありません。

コメント登録

コメントを入力してください。
一旦登録したコメントは、あとで編集できませんのでご注意下さい。