CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:  Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus! |
| | Problème de tableau sur PA ! |  |
|  stardust 
{ Membre }
 Messages : 24
 | Bonjour, bonsoir, bonne nuit, bon matin, à votre choix !
Mon problème s'avérera peut-être très simple en fin de compte, mais comme j'ai la sainte horreur des tableaux et que j'ai déjà essayé une bonne dizaine de fois de le résoudre par moi-même, la seule solution qui restait était de demander de l'aide (à vous =D) !
Pour expliquer mon problème, une image vaut mille mots ^___^ ~
(Je viens de me rendre que j'ai fait une faute dans une des phrases lol C'est plutôt l'espace entre les deux TD et pas les divs =P)
Et bien sûr, le fameux code >
- Spoiler:
- Code:
-
<table style="background-image: url(http://d.imagehost.org/0825/paback.png);" align="center" border="0" cellpadding="0" cellspacing="0" height="658px" width="840px"><tbody> <tr> <td width="20%"><div id="boxpa">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum </div></td> <td width="20%"><div id="boxpa">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum </div></td> </tr> </tbody> </table>
Je vous remercie d'avance d'avoir la pris la peine de lire mon message et de m'aider avant que je vire folle et que j'ai l'envie de brûler tous les codes de table au monde @___@ | | |
| | | | Invité Invité
| Salut!
Pour l'espca, met toi en mode visionnage et retire les espaces, car je ne vois pas pourquoi il y a autant d'espace. Tu enlève juste les espaces en te mettant en mode visionnage.
Ensuite, pour le problème de centrage, j'aimerai jeter un oeil sur ton CSS, peut être que le problème vient de là. | | |
| | | | stardust
{ Membre }
Messages : 24
| Il est impossible d'enlever les espaces en mode ''visionnage'' dans le Panneau d'Administration ... Du moins, ça ne marche pas de mon côté. La seule chose qui s'enlève c'est le texte, mais ça fait plus bugger mon code qu'autre chose.
Le seul CSS qui est en lien avec le tableau de ma PA est le suivant > (c'est les config. des 2 divs)
- Spoiler:
- Code:
-
#boxpa
{color:#fff;
font size: 6pt;
font-family: Courier New;
text-align: justify;
background-color: #6A6A6A;
padding: 8px;
width: 220px;
filter:alpha(opacity=80);
-moz-opacity: 0.8;
opacity: 0.3;
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;}
Merci ^^~ | | |
| | | | Basil Hawkins
{ Membre hyper-actif }
 Messages : 2912
| Essaie de mettre une taille précise genre 150px pour la taille de tes div et ça devrait marcher ~ | | |
| | | | stardust
{ Membre }
Messages : 24
| La taille de mes divs est déjà à 220 px, je n'irais pas plus bas parce que sinon c'est trop petit et on ne verrais pas grand chose du texte. Si tu parlais de changer la valeur des td, j'ai essayé de mettre les valeurs en px à la place des %, mais ça ne change rien sauf si je vais à plus de 600 px (et encore, ça ne déplace que la div de droite) ...
Eww x___x'' | | |
| | | | Basil Hawkins
{ Membre hyper-actif }
Messages : 2912
| Les % ne marchent pas sur les "td" habituellement  Tu dois trouver la bonne valeur en pixels  | | |
| | | | Argo
{ Membre }
Messages : 35
|
Je te propose ce code-ci:
- Code:
-
<table style="background-image: url(http://i.imagehost.org/0885/test.png);" align="center" border="0" cellpadding="0" cellspacing="0" height="500px" width="840px"><tbody> <tr> <td width="20%" valign="top" align="right"><br /><br /><br /><br /><br /><br /><br /><br /><br /><div id="boxpa">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum </div></td> <td width="3%"></td> <td width="20%" valign="top" align="left"><br /><br /><br /><br /><br /><br /><br /><br /><br /><div id="boxpa">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum </div></td> </tr> </tbody> </table>
Je me suis permis de réduire l'espace de ton image, avec un coup rapide sous photoshop: si cela te dérange, le même code avec ton image initiale:
- Code:
-
<table style="background-image: url(http://d.imagehost.org/0825/paback.png);" align="center" border="0" cellpadding="0" cellspacing="0" height="500px" width="658px"><tbody> <tr> <td width="20%" valign="top" align="right"><br /><br /><br /><br /><br /><br /><br /><br /><br /><div id="boxpa">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum </div></td> <td width="3%"></td> <td width="20%" valign="top" align="left"><br /><br /><br /><br /><br /><br /><br /><br /><br /><div id="boxpa">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum </div></td> </tr> </tbody> </table>
Alors je t'expliques un peu ce que j'ai fais. J'ai rajouter dans chacune de tes cellules une valign="top" pour que celles-ci s'alignent verticalement en haut. Naturellement, comme ça c'était pas suffisant étant donné que ça ce collait le "plafond". Donc j'ai rajouté des
. Si tu en rajoutes tes cellules descendront, si tu en enlèves, elles montent. ( Si tu modifie cela, pense bien à le faire sur les deux cellules, pour qu'elles restent symétriques.)
Ensuite j'ai mis un align, de ta première cellule sur la droite, et de même pour la deuxième à gauche. Pour qu'elles se rapprochent, mais encore une fois elles étaient collées. J'ai donc rajouté une cellule vide au centre avec une largeur de 3%. Les 3% sont bien entendu par défaut, si tu veux l'augmenter ou le diminuer, à toi de voir.
Voila voila, j'espère que ça te convient.
Cordialement,
Argo
Ps: les "%" marchent parfaitement.
| | |
| | | | stardust
{ Membre }
Messages : 24
| Wahou, tu me sauves la vie !
Merci beaucoup, c'est exactement ce que je demandais et je me sens assez idiote de ne pas avoir pensé au align= right/left, mais je ne savais pas par contre que l'on pouvait rajouter un valign=top pour que les cellules soient automatiquement en haut. Je vais m'en souvenir la prochaine que je fais un tableau 
Néanmoins pour ce qui est de la coupe de mon image, je vais tout de même conserver la mienne parce que les deux divs ne sont pas les seules choses que je veux inclure dans ma PA et le reste prend suffisamment de place pour occuper tout l'espace sur mon image de fond ^__~
Bref, encore une fois, merci =D ! | | |
| | | | Basil Hawkins
{ Membre hyper-actif }
Messages : 2912
| Je classe ~ Argo --> Les "%" ne marchent pas pour "height" | | |
| | | | Contenu sponsorisé
| | | | | | | Problème de tableau sur PA ! | |
|
Sujets similaires | |
|
| | Permission de ce forum: | Vous ne pouvez pas répondre aux sujets dans ce forum
| |
| |
| |
|
| Partenaires Or
|
