Drupal7にTwitter Bootstrap3 – Themeの環境でIE8をサポートする

Mar 23, 2015
AD:

本来であれば、Twitter Bootstrap3はIE8をサポートしているはずなんですが、なぜかDrupalのTwitter Bootstrap Themeを使用するとIE8でうまくいきませんでした。
下記の内容で問題なく表示されるようになりました。
原因はIE8がCDNをサポートしていないのが問題ではないかと言われていますが、実際のところなぜ起きるのかは追っていません。

モジュールのインストール

下記の2つのモジュールをインストール
Bootstrap Library
Respond.js

CSS&JSのAggregate and compress化

下記のページより変更が可能です。
/admin/config/development/performance
Screen Shot 2015-03-23 at 11.08.28 am

Twitter: 0 | Facebook: 0 | Google Plus: 0 | Hatena: 0 | Pocket: 0 | Total: 0 | Feedly: 0

DroupalでJavascriptとCSSを圧縮する方法

Mar 23, 2015
AD:

はじめは、プラグインが必要かと思ったのですが、管理画面より設定が可能です。

下記のページより設定できます。
/admin/config/development/performance
Screen Shot 2015-03-23 at 11.08.28 am

Twitter: 0 | Facebook: 0 | Google Plus: 0 | Hatena: 0 | Pocket: 0 | Total: 0 | Feedly: 0

Ubuntu(12.04) にlessをインストール

Feb 22, 2013
AD:

過去のサイトで、Lessを使用しているものがあったので、lessをインストール

Twitter: 0 | Facebook: 0 | Google Plus: 0 | Hatena: 0 | Pocket: 0 | Total: 0 | Feedly: 0

lessで@importしたらcacheが残って変更が反映されない件

Feb 13, 2012
AD:

WordPressのRoots Themeの中でlessが使われているのですが、ちょっとトラブったのでそのメモです。

問題は、lessの@importしたらcacheが残って変更が反映されない

それで、調べると同じような問題に起きている人がいる模様。
https://github.com/cloudhead/less.js/issues/47

解決方法

結局、下記のスクリプト追加して解決できました。
[php]
[/php]

ちなみに、bootstrap.lessの中はこんな感じです。

[php]
// CSS Reset
@import “reset.less”;

// Core variables and mixins
@import “variables.less”; // Modify this for custom colors, font-sizes, etc
@import “mixins.less”;

// Grid system and page structure
@import “scaffolding.less”;
@import “grid.less”;
@import “layouts.less”;
[/php]

Twitter: 0 | Facebook: 0 | Google Plus: 0 | Hatena: 1 | Pocket: 1 | Total: 2 | Feedly: 0

Ubuntuにlessをインストール&設定

Feb 11, 2012
AD:

最近、WordpressのRoots Themeを触っているのですが、その中でlessが使われていたのでそのメモ

lesscの場所を確認

コマンドを入力させやすくしておく

: Could not find RubyGem less と出てエラー

調べてみると、sudoでインストールしたので、lesscのコマンドもsudoで実行しないといけないらしい。。。

既に、Rubyの開発環境はrvmで導入済みの状態です。

せっかくなので、Roots Themeのlessでのcssを書き出しもメモしておきます。

ちなみに、上のRoots Themeは、標準では、css/の中にあるcssを読み込むんですが、下記のやり方だとlessの中に書き出されます。

上記のコマンドを試したけどダメだったので、./inc/roots-actions.phpを書き換えました。

Twitter: 0 | Facebook: 0 | Google Plus: 0 | Hatena: 1 | Pocket: 0 | Total: 1 | Feedly: 0

CSSによる画像ロールオーバーのちらつきを防ぐ方法

Sep 23, 2009
AD:

最近、久しぶりデザインをすることが増えたので、CSSを触っているんですが
CSSを使って画像ロールオーバー使うことがあるのですが、それが画面を開いた段階では、a:hoverに指定した画像を読み込みに行ってくれなくて
困っておりました。そこで下記方法を思いつき対応しました。

サンプル

画像を一枚にまとめます

使用した画像
rollover

htmlのソース

CSS

Twitter: 0 | Facebook: 0 | Google Plus: 0 | Hatena: 0 | Pocket: 0 | Total: 0 | Feedly: 0

Fonts list for Mac & Windows in common.

Feb 28, 2009
AD:

I checked fonts list for Mac & Windows in common.

Arial Smaple text
Arial Black Smaple text
Century Gothic Smaple text
Comic Sans MS Smaple text
Courier New Smaple text
Lucida Sans Unicode Smaple text
Impact Smaple text
MS UI Gothic Smaple text
Times New Roman Smaple text
Trebuchet MS Smaple text
Verdana Smaple text

Twitter: 0 | Facebook: 0 | Google Plus: 0 | Hatena: 0 | Pocket: 0 | Total: 0 | Feedly: 0

text-indent:-9999pxでaタグにつく横棒を消す方法のメモ

Sep 29, 2008
AD:

今更ですが、よく忘れるのでメモしておきます。

にすると点線自体が消えるので すべてのブラウザでクリック領域がわかりにくくなります

にするとMacのIEでおかしくなる(確かリンク自体機能しなくなるとか)という点を除けばこちらの方がいいと思います。
もしくは Macにのみハックを使用するなどがもっとも

個人的に、「text-indent:-9999px」は使いたくないですが、どうしても昔のテーブルで作られたものを
コーディングし直すときにつかったりします。

Twitter: 0 | Facebook: 0 | Google Plus: 0 | Hatena: 0 | Pocket: 0 | Total: 0 | Feedly: 0

meadow(Emacs)のCSS css-mode.elのメモ

Jul 23, 2008
AD:

css-mode.el

Ctl+C + Ctl+U = url()を挿入
Ctl+C + Ctl+C = /* */を挿入
M+tab キーで CSS の属性を入力補完してくれる。

Twitter: 0 | Facebook: 0 | Google Plus: 0 | Hatena: 2 | Pocket: 0 | Total: 2 | Feedly: 0

IE6をCSSで中央配置にする際のメモ

Jul 10, 2008
AD:

IE6をCSSで中央配置する際に、よく忘れるのでメモしておきます。

IE6には過去のIEの互換性のため、DOCTYPEの有無により、標準準拠モードと互換モードを切り替えるようです
(DOCTYPEスイッチだって)
で、互換モードだとtext-align:centerとか指定しないと中央配置されない。
HTML 4.01の標準モードだと、互換モードになるので、ちゃんと、htmlの一番上に宣言を明確に書くといいらしい。

参考として、

メモ
IE5(Win), IE5.5(Win), IE5.2(Mac)、ネスケ4もmargin:autoが未サポートだって。

Twitter: 0 | Facebook: 0 | Google Plus: 0 | Hatena: 0 | Pocket: 0 | Total: 0 | Feedly: 0

Search Keyword

Meta

face Ayumi Mizoshiri
WEB developer

FacebookPage

Popular Posts

Sorry. No data so far.

ARCHIVES