[Résolu] Positionnement des boxs

Bonjour à tous.

Merci à toutes les réponses déjà données, elles m'ont permis de progresser jusque là.
Mais arrivé là justement, je bloque et n'arrive plus à progresser, je demande votre aide.
Même si j'ai un métier affilié à internet, je suis totalement néophyte en création de site internet.

Je pense donc que le site que je vais vous montrer regorge d'énormités, difficilement toléré par la rigueur que vous avez coeur à appliquer. Mais bon, en bon débutant que je suis, c'est pour ça que je viens ici : pour vous tendre le bâton et me faire battre ^^.

Bref, en plus tous ce que vous remarquerez, mon problème majeur actuel est lié au positionnement de mes boxs, qui se chevauchent sur des écrans de plus petites résolutions, ou au simple zoom(+) du browser. le site en question : cv.ygen.fr)

Oui, j'ai du faire n'importe quoi. J'ai essayé différentes méthodes Mais rien à faire .

#content {display: table;}  
    #mainContent {display: table-cell; width: 620px; padding-right: 22px;}  
    aside { display: table-cell; width: 300px; }  

(et en nommant bien les div et les balises coté HTML)

Ca marche presque, càd que le <aside> se positionne bien à droite du #maincontent. Mais le #maincontent s'affiche en pleine largeur (soit 3800px à cause de mon slide show fait (comprendre récupérer ) en CSS)

Question : pourquoi #maincontent ne s'affiche pas en 620px comme définit dans le CSS ?
J'ai regardé si d'autres éléments était parasites, et essayé des overflow:hidden mais rien à faire.

Bref, je fais sans doute fausse piste. une idée ?
Merci d'avance
Modifié par Dakaz (05 Oct 2012 - 11:13)

Bonjour Dakaz

je n'ai pas suivi tout l'historique parce que je débarque fraichement mais il y a t il une adresse ou l'on peut voir ton site en chantier ?

Bonjour s'Rvo.

Oui elle est indiqué dans le message.
(je ne l'indique pas de nouveau pour rester dans la charte
du forum, mais je viens de la mettre en gras du coup)
Modifié par Dakaz (05 Oct 2012 - 11:14)

autant pour moi je n'avais pas vu... le vendredi les deux paupières ne sont pas toujours bien décollées .

La largeur de ton site est sensé faire combien de pixel. Là je suis en 1280x1024 et ça déborde complètement sur firefox.
Modifié par S'Rvo (05 Oct 2012 - 11:23)

1024px, mais je me rends bien compte en le disant qu'il y a une couille dans le potage,
puisque les slideshows fonts 800px de large et mes boxs aside font 317px.

Rahlala, c'est le problème de bosser en 1680x1050, puis voir son site sur un 15"

Du coup, pour reformuler, et me corriger, je souhaite que le site soit visible complètement sur une résolution de 1280x1024 (je prends ta résolution mais ce qui me semble correct) mais je souhaite surtout que sur des résolutions inférieures, on est des ascenceurs qui apparaissent plutôt que des boites qui se chevauchent. Espérant être clair.
Modifié par Dakaz (05 Oct 2012 - 11:49)

hé hé c'est pas bien grave. De ce que je vois il faudrait revoir un peu la structure global html et les styles qui vont avec. T'as une maquette design ou tu fais tout directement en code ? Si t'as une maquette balance là par mail et je pourrai te proposer une structure globale qui devrait tenir la route. Envoie ça par mail si tu peux. ça urge ton site ?

Note : je viens d'éditer mon message au dessus du tiens.

Maquette : From skratch
mais le rendu sur mon écran correspond à ce que je veux à part un léger décalage à droite.
En voici donc une capture d'écran : http://www.ygen.fr/images/Marc-Blanchoud/CV.png

(Merci bcp de l'attention apporté S'Rvo)

une dernière question après je testerai ton code. Ton titre doit faire la largeur de la colonne de gauche ?

Pas obligatoirement, rien de définitif, j'améliore le design petit à petit selon le feeling.
(on en revient au from skratch, je fais comme je sens, j'ai pas une maquette à intégrer ^^).

ok d'acc

Suite (parceque je continue à chercher en parallèle)

J'ai mis des "relative" à mes positions définie jusqu'alors en "absolute"
(oui, je viens de comprendre qu'il ne faut pas jouer avec ça quand on sais pas faire)

Du coup, cela a réglé de nombreux problèmes que j'avais.
(le fait que ça fonctionne ne signifie pas que je n'est pas fait n'importe quoi pour autant.)

Cependant, j'ai toujours des différences d'un écran/résolution à l'autres
A savoir, ma balise H1 et la box "Loisirs & Hobbies" recoivent toutes deux des retours à la ligne inopinée sur des plus petites résolutions. Je continue à fouiller, je pense que ça viens des valeurs définie en "em" et non pas en "px".

Bon, j'ai encore quelques boutons des mes ul li qui se trimbale pour essayer de masquer mes h3,
mais globalement, entre les position:relative, et les em transformé en pixels, ca tiens mieux la route.

Je passe le post en résolu (rapport au problème initiale) mais cela n’empêche pas que je continue d'attendre de vous toutes remarques/conseil pour améliorer le site.

Bah tant mieux alors Ceci dit pour éviter des surprises et avoir une structure assez solide il faudrait revoir pas mal de petites choses, sans être puriste pour autant Par exemple, tu devrais faire en sorte que ton nom "pousse" l'accroche (h1) plutot que de faire en sorte qu'il remonte au dessus avec un margin-bottom négatif si je dis pas de bêtise. Je suppose que l'ordre html est du à un soucis de référencement mais en intégration il est toujours plus simple de maintenir un flux d'affichage qui soit le plus naturel possible en tout cas quand on n'a pas trop l'habitude. ça évite l'accumulation de bidouilles qui en général finissent par rendre bancale le montage global de la page. C'est toi qui a mis en place le html ou tu es parti d'une structure existante ?
Si ça te dit et que t'as un peu de temps à tuer on peut revoir ta page au fur et à mesure. Moi ça m'entrainera à expliquer un peu les choses
Modifié par S'Rvo (05 Oct 2012 - 14:02)

Oui, c'est moi qui est mis en place le html (c'est pour ca que c'est bancale ;p)

De même, tu as bien compris la bidouille du H1 dans un soucis de référencement,
Mais je suppose qu'entre un webdesigner, un intégrateur, et un référenceur,
il y en a toujours un qui tombe à l'eau ! Eh ben ca sera pas moi ce coup-ci !
(ahlala, ca me rappel mes discussions/bataille avec mes collègues développeur, nostalgie !)

Comme expliqué plus haut, que ce soit pour avoir une belle page, ou à titre de formation personnelle,
oui, je veux bien tester tes talents de pédagogue, mais surtout de techniciens ;p
Modifié par Dakaz (05 Oct 2012 - 14:10)

HA HA en effet, je connais aussi les tiraillements entre les différents métiers Cela dit je ne pense pas que ce soit une bataille mais plus une affaire de compromis (vlà que ça recommence ). Je m'arrête là ça n'est pas le propos. Pour les conseils, peut être qu'on devrait les échanger par mail pour pas trop surcharger ce sujet d'autant qu'il est clos. Qu'en penses tu ?
Modifié par S'Rvo (05 Oct 2012 - 14:20)

Oui, bonne idée, je passe en MP