HTML/CSS のどんな質問にも優しく答えるスレ 35
■ このスレッドは過去ログ倉庫に格納されています
ここは初心者からベテランまで、全ての人を対象に優しく答えるスレです
類似質問、重複質問、丸投げ大いに結構。HTML / CSS 関係の事なら何でもOK
分からない人は何回聞いても結構。質問するときはIDを出すためにメール欄を
age にすることをおすすめします。
回答してくれる方は優しい人のみ！ 質問者に対して暴言を吐く人はこのスレを見るな！！
終わった話を蒸し返すやつは このスレにくるな！！！
自分で調べろという回答も禁止！！回答するかさもなくば何も書き込むな！！
質問側も節度あるレスで！質問前にスレ内を検索しましょう
■次スレについて
基本的にレスナンバー>>980を取った人（立てられない場合は次の宣言者）が立てて下さい
重複を避けるため、独断でスレ立てはせず必ず意思表示をしてから立てて下さい（>>980を取った場合も）
立てられない事が予め分かっている場合は、>>980付近の書き込みは自重しましょう
■前スレ
HTML/CSS のどんな質問にも優しく答えるスレ 34
http://mevius.5ch.net/test/read.cgi/hp/1538966757/
■関連スレ
Webサイト制作初心者用質問スレ part249
http://mevius.5ch.net/test/read.cgi/hp/1529144063/
■HTML
HTML Living Standard 日本語訳
https://momdo.github.io/html/index.html
■CSS
Selectors Level 4 日本語訳
https://triple-underscore.github.io/selectors4-ja.html >>434
客で使ってるとこあったけどその時7.1だったぞ
変えられるはず >>435
ありがとう
連絡来てどうにかしてくれって言われたわ
さすがにwpも動かんとか死ぬと思った
まぁ来年やな、良い音塩！ >>436
アルファメール…
事前に確認とって開発開始したのに
納品直前になってPHP4しか動かせないとか言われ、蔵の○塚の営業担当にぶち切れた記憶が蘇ったわ
結局4で動くようにデグレを強要されるハメに。
その当時ですらさすがに4はないだろ…と思ったもんだが…鯖によっては変えられないかもよ…
それ以来、大○の関わるサービスには近寄らないようにしてる >>437
・・・えｗ
新年早々ヤバイ案件かよ〜〜
転送で対処するかな、さすがにphp4はどうにもできんわ PHPのバージョンはなんでもいい
3とか4でも変わりない
そう、HTMLならね https://codepen.io/infologicmation/pen/KbZoqK
先輩方よろしくお願いします
ちなみにここで使われているMathJaxは見た目上の問題を分かりやすく示すために使われているだけであって、
MathJaxはなんの関係も無いです。 アルファメールはphp4
プラチナも4
プレミアが5.4と7.0（どっちもセキュリティサポート終了）
アルファメールは絶対に使うな >>445
ありがとうございます。
しかし、リスト表記時の｢・｣はどうしても残しておかなければなりません さすがにそれはその場しのぎすぎてちょっと実用に耐えないです li要素でflexプロパティを使用しても、li要素の点｢・｣が消えなければいいのですがね… うお、できたｗｗｗ
すげー時間の無駄だったｗｗｗ
spanとp両方に
display: list-item;
漬けてるから好きな方外してくれ
あと、(1)とか文字の位置は
text-indent: -100px;
で調節すればok
https://codepen.io/anon/pen/RExEdW >>450
ありがとうございます。
ベストではないですが、現状ではそれがベターなのでそれで使わさせて貰います 自分が考えついた物はベスト
人に教えてもらったいい物はベター
人に教えてもらった物はクソ
これがしったか初心者クオリティ ではベストではない点について言わせて貰いますと
>>450で見た目上、生成されている｢・｣はliの｢・｣ではなく、span.insert_stringに対して生成されたlist-itemによる｢・｣であって
これは本筋ではないと感じました。(HTML上の論理的な構造が変わっている)
僕の中でのベストとしては、HTML内の構造はそのままで、(javascriptで？)insert_stringを適切に移動”だけ”させて、>>450みたいにしたものだったのですが。 リストマーカーってあんまりそのまま使わなくなっちゃったなー 使うとしても一旦消してbeforeで中黒付けるかな
ブラウザでどう表示されるか分からんのは怖い >>458
俺もそれだなあ
list-style周りがあまり発展しないのは
やっぱ使う奴が少ないからなんだろうか >>459
だろうね
そもそもモバイル化に伴って、リスト自体が少なくなったと思う
ulやolはあんまり使わない。メニューぐらいかな？メニューだと絶対にlist-styleは使わない
あとは何かの手続き順序とか、ランキングの表でもあればolを使うかもしれない
とにかくlist-styleは使い勝手が悪い 画面に直接マッキーで点入れたいとこに打てばいんじゃね？
俺って天才かよ >>461
fixedやろ、それは考えてﾌﾌｯってしてやめた
わざわざ言うもんじゃないんだ ブログで数学の証明を書いてますので箇条書きは使いまくりですね 隣接セレクタが効きません。なんでだめなんだ...？
// HTML ------------------------
<div class="menu">
<ul>
<li>Menu 1</li>
<li>Menu 2</li>
<li>Menu 3</li>
</ul>
</div>
// CSS ------------------------
.menu li + .menu li {
margin-top: 10px;
} >>466
それでいいのか...！有難う有難う感謝です Twitterウィジェットのtweetswindが使えなくなってしまったので、新しくfeedwindを使って表示させたいのですが、うまくできません
iframeタグでtweetswindを使っていたので、feedwindでiframe用のコードを取得してコピペしたのですが、元のページが文字化けしてしまいます。元のページはUTF-8です 答えてやりなよｗ
>>468
「iframe 文字コード」で検索すれば色々でてくる
文字コードは実物みないと解決策がわからん 質問です。
たまに画面がグチャってるサイトってありますけど、
こういうのは意図的に、ワザとこうなってるのですか？
http://www.flower-record.com
それとも特定の別ブラウザで見ると、綺麗にレイアウトしてるものなのですか？
自分だけこう見えるってこと？
なぜこうなるのか、意味が分りません >>471
IE11だとまともに見える（デザインセンスは酷いけど）
まぁ、あまり気にしなくていいと思うよ。知り合いなら教えてあげたほうが良いかも <thead>の子でthの代わりにtd使ってもいい？ thead,tbody,tfootとth,tdの区別というか意味を理解できてないのかな
thead,tbody,tfootはテーブル全体のヘッダ、本文、フッタでth,tdは各項目のヘッダ、値だからそれによる制約はない こういう構造ってHTML的にOKですか？
二つのリンクはスタイルで間隔開けるんで、ユーザビリティは問題ないです
<p>
<a>Aへのリンク</a>
<a>Bへのリンク</a>
</p> フロントの自動化って何使ってる？
Gulp？webpack？npm script？ >>476
そもそもどこに問題があるかもと思ったのか しつもんです。
あなたにとってhtmlってなんですか？ flex-wrap:wrapで幅が決まってないアイテムが複数行になった時に
コンテナの右側がガタガタになるのを綺麗に見せるテクってありませんか？
こんなのです
https://jsfiddle.net/uwaoyqc6/ >>486
justify-content: space-between;
入れるとか flex-grow:1でいけました・・・
これ行ごとに効くんですね
知りませんでした ページ全体の<h1>より上にある<section>や<article>ってどういう扱いなの？
HTML5 Outlinerでは意図したアウトラインになるから、位置は関係なし？ >>492
なってないよ
デフォのコードの下２行を入れ替えても結果同じ https://codepen.io/infologicmation/pen/KbZoqK
先日｢連番リストの先頭文字の高さ位置を揃えたい｣として質問したものです。
ここの方のアイデアを用いて実装をしていたのですが、問題が起きました。
上記サンプルで言う所の(iii)項目のリスト構造がおかしくなっています。
display : flex の効果が内側の方のリスト<ul>にも影響してしまっているようです。
親要素のflex の効果を、第1子要素(？)のみに適応させていたらよかったものが、第2子要素以降にも適応されたせいで
<ul>がブロック要素であることが解除されて、インライン要素になったことで、おかしくなったみたいです。 要するに、現在の問題は、
<ul>
<li style="display:flex;align-items:center;">test:
<ul>
<li>a</li>
</ul>
</li>
</ul>
こう書いた時に、内側の<ul>までflexの効果が効いて、内側の<ul>の"改行･字下げ"効果が消えてしまっていることです。 簡単に言うとこう言うことです
<ul>
<li style="display:flex;align-items:center;"><span style="display:list-item;text-indent:-40px;">A</span>←このAの表示位置はここでよいが、
<ul style="display:block;">
<li>ここの<ul>までflexが効いて欲しくない</li>
</ul>
</li>
</ul> 何かあっけないぐらいに自己解決できてしまいました
CSSで
display: inline-block;
text-indent: -70px;
text-align: center;
これだけで十分だったんですね https://codepen.io/infologicmation/pen/KbZoqK
やっぱりまだ問題が解決しませんでした。
(3)の｢折り畳み要素｣をクリックすると、要素が展開されて｢ここがその中身｣と表示されます
しかし、その時先頭文字である｢(3)｣の表示位置が勝手に移動されてしまいます。
原因は、details要素を｢display:inline-block;｣としているからです。
しかし、これを取り除いてしまうと、今度は、(details要素がブロック要素であるため)｢(3)｣と｢折り畳み要素｣の表示位置の関係がズレてしまいます。
二律背反の状況になってしまいました。
どうしたらいいですか？ 何度もレスしてしまいましたが
details.det{
display:inline-block;
vertical-align: top;
}
のようにvertical-alignを追記するといけました。 HTML,CSSって複雑化していくほどに、｢アッチが立てば、こっちが立たず｣っていう状況の連鎖なんですね
Javaのオブジェクト指向やデザインパターンみたいに、HTML+CSSもそういうのってあるんですかね >>502
そもそもプログラムとそうでないものを同等に扱おう
って考えが間違ってんじゃねえか？ もしかしてこのスレって、プログラムは一切知らずにHTML、CSSだけしか知らない奴っていんのかな 横に長いコードをインデント入れて整理してたら1ページ2000行を超えてしまったんですが
行数が多いほど読み込みに時間がかかるとか、そういう事ありますか？ プログラマーみたいな底辺奴隷にだけはなりたくないな …むかつくがたしかに日本においては90%くらいは底辺奴隷に身をやつしていると認めざるを得ない… おれが小学生の時はそんなもんなかったからな
石を打ち欠いたり磨いたりしてたのはなんとなく覚えてる 一年坊は対局なんてはえーんだよって言われて
先輩に打ち欠いた碁石を砥石で研がされていたのはいい思い出 俺みたいなフロントもバックもやってる孤高のエンジニアからすれば
ものすごく次元の低い喧嘩だな >>512
処理内容やサーバの性能次第としか答えようがない >>523
HTML部分のファイルサイズはあまり関係がないという事ですか？ >>522
お前の次元が低いからフロントもバックもやるんだろ
そんなもの土方にやらせる仕事
お前は他人を使う能力がないから自分が働かないと何もできない
本当に優れた人間は自分が何もしなくても他人が勝手に仕事をこなしてくれることだからな 自分より優れた人に雇われた事ないからわからん
すまん理解してあげられなくて >>525
2000行なら2000回\nが入るってことだ わからない人の質問にわかる人が答える
それだけのことなのに
なんで上だの下だのと順位をつけたがるのか >>512
改行1つに1バイト、スペースやタブ1つに1バイト
2000行なので改行で2KB、それプラススペース・タブ分が無駄に転送量増える
まあ気にすることないけど、気になるならgzipすればいい
ってか最近はgzipするのが当たり前になってきてるから、これを期にしてみれば
>>524
いいけどIEやEdgeでは工夫が必要
Flexboxでさくっといかない時に使ってる こういう疑問や不安て
こんだけネットが速くなってもやっぱ経験するんだな
なんかほっこりした >>530
現実世界で底辺だから、せめてネット上だけでも上に上がった気になりたい
そういう惨めな生物なのだ ■ このスレッドは過去ログ倉庫に格納されています
