Overblog Tous les blogs Top blogs Photographie
Editer l'article Suivre ce blog Administration + Créer mon blog
MENU

Paris, photo, humeurs, un peu de HTML/CSS pour faire sérieux. Feinte innocence et vraie naïveté (ou vice-versa). Encore un blog qui agite ses petits bras en couinant "Viens me lire !"

Publicité

1024 pixels - le retour

Pas de quoi faire un nouvel article, je rajeunis donc celui-ci de quelques semaines.

Tout rentre désormais dans moins de 1000 pixels – sans que j'aie dû rogner la largeur des articles-z-et photos, eeeeet toc ! Le petit bateau escamote toujours le volet de gauche, si vraiment vous avez besoin de place.

Ça vous plaît-y toujours, organisé comme ça ?


Dimanche 1 juillet 2007

1024 pixels

Dans ce commentaire du précédent article le grand Djac Baweur, défendant sa, je cite, "réputation de chieur", faisait observer que mon blog est quelquefois un peu trop large pour un écran de 1024 pixels.

Il avait raison, le bougre : quand une photo de 600 pixels de large figure sur la page, la facture totale en largeur est de 1100 pixels. Vexant.

Résoudre le problème en tripotant les marges ? Elles m'ont demandé assez d'efforts pour que j'y répugne. Alors ? Sortons du problème par le haut ! Cliquez donc sur le petit bateau, vous comprendrez tout de suite ! Ze King of JavaScript strikes back ! En plus, c'est assez simple : deux fois quatre lignes pour tripoter le style de la page. Le plus gros morceau a été de fabriquer une image convenable pour le bouton …

Rien à voir mais, tant que j'y étais, les deux bandeaux tramés en haut et bas de page renvoient désormais à l'accueil. Et puis ça s'éclaire quand la souris passe dessus, c'est mimi – je suis resté un grand enfant, dans le fond.

Publicité
Retour à l'accueil
Partager cet article
Repost0
Pour être informé des derniers articles, inscrivez vous :
Commenter cet article
C
révolution !
Répondre
W
cactus> ça faisait un moment, dis donc !Djac> bon, pour les autres je m'en suis sorti autrement, il ne reste plus que la pagination à jouer sur une taille zéro. Peu te chaut ?Tu as bien raison !
D
Zut alors, c'est la première fois que je vois Safari en défaut (d'habitude, c'est plutôt le contraire).<br /> Pareil, sur mon blog, j'ai un drôle de bidule avec le menu déroulant, avec des bouts qui s'affichent bizarrement et qui reste en traces résiduelles, alors que FF pas de prob.<br /> Zut alors (bis).
Répondre
W
Je ne pratique pas assez les Mac mais je sais que Safari, s'il reste bien plus convenable que d'autres, n'est pas la perfection des vertus :-(J'ai supprimé,avec la même technique, d'autres bouts de texte qui m'agaçaient, tu les verras donc :- "publié dans" (mais je me dis que je dois pouvoir m'en sortir autrement)-"photo précédente" et "photo suivante" dans l'album photo
D
Safari, comme d'hab. <br /> J'essaierai un display:none, non ?<br /> (en effet sur FF pas de problème)
Répondre
W
display:none pas possible dans le cas d'espèce . C'est un lien, et je veux évidemment le conserver à l'affichage mais sans voir son texte, d'où le recours à la taille zéro. Si on pouvait faire color:transparent, je l'aurais tenté aussi ! Tu m'as mis la puce à l'oreille, du coup j'ai soumis le blog à Browsershots, et ma combine marche sur tous les navigateurs sauf, en effet, safari 2.0 ... Il y a d'autres détails irritants dans Safari : par exemple, les boutons OK et Go des modules "recherche" et "abonnement" ont une image à moi. Résultat : que dalle sous safari, qui fait systématiquement des boutons "à la MacOS". Je vais finir par mettre un lien "téléchargez Firefox" (ou Opera) dans un coin de l'écran !
D
Et pis c'est pas pour dire, mais suivant et fin sont bizarrement affublés de flêche qui les recouvre, ça fait un peu déssordre...<br /> Comment ça, je me venge bassement ?<br /> ;o)
Répondre
W
"suivant" et "fin" devraient être invisibles (font-size:0) . ...  quel navigateur emploies-tu ? Safari ? Autre ? J'ai comme un soupçon, là !
R
YES !<br /> <br /> merci Grrrrand Ssssorcier :-)))
Répondre
R
ben oui, que ceux-làet le cache j'ai déjà fait, et encore maintenant..mais c'est que sur safari, ceci dit il n'y avait pas de problèmes avant !??
Répondre
W
Hokus - pokus - SHAZAM !Et maintenant ?
R
dis, Ô Grand Sorcier BrendiepourlesintimesWilhelmpourlesautres au pouvoir exponentiel contre les méfaits de l'infâme dieu CSS....<br /> pourquoi on ne voit plus rien d'affiché dans les colonnes "Derniers articles", "Commentaires", "Archives", et "Ailleurs" ?
Répondre
W
Gné ? Seulement ces modules-là ? Depuis aujourd'hui ? Exorcisme habituel : gnagnagna rafraîchis l'affichage gnagnagna vide le cache (qqs modifs entre hier et aujourd'hui).Si le pb est plus ancien, je ne vois pas trop ? Chez moi tout baigne
D
Héééé ben voilàààà !<br /> C'était pas si compliqué !<br /> <br /> Kissékavé raison, mmmh ? Akikon dit merci, mmh ?<br /> ;o)
Répondre
W
Non mais dis donc, impudent galopin, faut pas charrier ! Que tu aies eu raison à propos de la trop grande largeur de l'ensemble, c'est dit dès le premier article. Pour le reste,j'ai fait à MON idée, neuhméalors ! :-D
D
Ho, j'oubliais, juste pour squatter un peu plus les commentaires (comme d'hab) : le coup du bateau, ça marche très bien.<br /> Belle technique, tout ça.<br /> Mais.<br /> Du coup, le texte fait presque toute la largeur du blog ; or, je le répète, une colonne de texte trop large est difficile à lire, typo élémentaire, mon pt'it pote.<br /> Hééé ouaiiiis, y'a qu'une solution, t'y échapperas pas, hin hin hin...<br /> :oD
Répondre
W
En somme et si j'ai bien compris, t'es jamais content ? :-D Allongez-vous, cher visiteur, parlez-moi un peu de votre enfance ... Plus sérieusement : naturellement que tu as raison du point de vue typo, composition et tout. D'abord : je n'ai pas dit mon dernier mot ! Si vraiment il faut chiader je peux, quand le volet gauche est escamoté, limiter la largeur de la colonne de texte à 600 pixels+les diverses marges. Eeeeet toc ! En dehors de toute frime technique, ce gadget est en priorité destiné aux écrans pas très larges. Si vraiment ils le sont encore trop (larges) il n'est pas interdit de rétrécir la fenêtre ... Je crois bien que c'est possible aussi sur un Mac........ M'enfin je dis ça, moi, c'est juste pour causer .........Edit : tiens, finalement j'ai fait ce à quoi j'avais pensé : en mode "colonne cachée", les articles sont dans une colonne de largeur fixe, et centrée sur le fond.* sifflotte d'un air dégagé*
D
Je ne peux laisser passer une telle lâche et vile provocation !! ;o)<br /> <br /> - pour la cache : oui, en effet, meaculpa, ronces fouettant mon dos, aller-retour Paris-Brest sur les genoux, tout ça tout ça...<br /> - Alors pour les images, par contre, mon pt'it pote, faut savoir que je sais parfaitement comment mettre des images de 3000 pixels, si j'voulais. Ouais, mais voilà j'veux pô. Et pouquoi qu'y veux pas ?<br /> Parce que :<br /> - ça met plus de temps à charger ;<br /> - ça me PRÉSERVE UNE LARGEUR DE BLOG qui apparaît entier pour tout le monde. <br /> Et les photos en 500 pixels sont très bien, ça suffit tout à fait.<br /> <br /> Donc, le guano de la blanche colombe n'atteindra pas le crapaud.<br /> ;o)<br /> <br /> (par contre, le coup de l'en-tête en transparence, alors ça ça m'épate)
Répondre
W
Que j'aime ces conversations sérieuses, sereines, approfondies, entre esprits supérieurs. Tiens, laisse-moi donc bourrer une pipe avant de te répondre, que je me concentre ...Pouf, pouf, pouf ...Alors voilà :- pour le cache, ne t'accable pas à l'excès.Tout le monde peut se tromper.Surtout quand on n'a pas encore bien compris toutes les finesses.Et puis, les artistes sont de grands distraits, c'est bien connu ...(et puis, t'as tellement envie de râler !)- pour les images, je ne doute nullement de ton aptitude à retapisser l'écran avec un portrait de Debussy (ou de Donald ? ou de Donald !). Je disais seulement qu'OB autorise un format maxi de 600x600 pixels, et que je m'en sers.- la largeur de blog, ça c'est un bon argument- le poids des photos me paraît moins décisif : une image typique chez moi dépasse rarement les 50Ko, on est plus souvent à 30Ko Pas de quoi fouetter un modem, non ?Le coup de l'en-tête, c'est très facile. Tout l'entête est un lien (display:block). Pour le fond de ce lien, j'utilise une trame, un tout petit motif  de 2x2 pixels : une diagonale colorée en marron, l'autre transparente. Quand on survole l'en-tête, je remplace la trame par une autre, plus claire. C'est du pur CSS.Va en paix, petit padawan. ;-)