Mise en page de tableau

Le premier forum francophone sur l'éditeur de pages Web multiplateforme (Linux, Mac OS X, Windows) qui monte… KompoZer, héritier de Nvu, permet de créer vos pages Web graphiquement (wysiwyg) sans aucune connaissance du langage HTML.

Modérateur : chinon37

Répondre
Maniulski

Mise en page de tableau

Message par Maniulski »

Bonjour tout le monde...

J'esère que quelqu'un pourra me venir en aide.
En effet, après avoir inserer un tableau dans Kompozer, malgré le fait que les bordures soit à zéro, les lignes sont toujours visibles dans mon navigateur.
J'ai fait bien sûr des recherches dans google, essayé différentes possibilités, mais toujours rien.

Alors à vous tous, s'ils vous plait... À L'AIDE

Merci d'avance
Maniulski
Arias
Messages : 4
Inscription : 27 sept. 2012, 09:21

Re: Mise en page de tableau

Message par Maniulski »

J'avais oublié, au cas ou ce serat utile, voilà le lien...

http://www.brasseriedefrance.de/Choucroute.html
Ymai
Tyrannosaurus Rex
Messages : 4220
Inscription : 12 mars 2005, 11:36

Re: Mise en page de tableau

Message par Ymai »

Bonjour
Tout semble bien se passer dans la feuille de styles "colorscheme.css".
Il faut indiquer que la largeur des bordures doit être nulle:

Code : Tout sélectionner

border:0
pour #sub_nav_column et pour #content_column

Et faites marcher un magret de canard, un...
ymai
« Un enfant de cinq ans comprendrait cela ! Allez me chercher un enfant de cinq ans ! »
Groucho Marx.
Maniulski
Arias
Messages : 4
Inscription : 27 sept. 2012, 09:21

Re: Mise en page de tableau

Message par Maniulski »

Merci pour cette reponse rapide..

Tout est à zéro.
J'ai même essayéde refaire un tableau en donnant dès le départ la valeur 0 pourles bordures, mais exactement le même effet...
Je ne comprend pas.

Pas de magret de canard tant que le site n'est pas en ordre... :)
chinon37
Animal mythique
Messages : 5319
Inscription : 21 mars 2005, 10:17

Re: Mise en page de tableau

Message par chinon37 »

Bonjour,

A mon humble avis, les bordures ont bien été mises à 0 pour tbody (tableau) mais pas pour td (cellule).
Le problème se situe dans la feuille de style main.css à la ligne 444 où on a:

Code : Tout sélectionner

.content td {
    border-right: 1px solid;
    border-bottom: 1px solid;
    padding: 3px 5px 3px 5px;
}
Un 0px en border-right et border-bottom devrait faire l'affaire :wink:
Mais il serait encore plus simple de mettre la règle:

Code : Tout sélectionner

border-style: none;
qui évite de jouer sur l'épaisseur nulle du trait.
On aurait donc:

Code : Tout sélectionner

.content td {
    border-style: none;
    padding: 3px 5px 3px 5px;
}
Dans l'éditeur de style de KompoZer, ça se traduit par choisir "aucun" dans le style de bordure

[pour moi, ce sera un magret avec un riesling :P :D ]


Le code mériterait une bonne simplification en éliminant [entre autre] les <big> qui pullulent au profit de règles de style avec la taille des polices.
Préferez Kompozer 0.8 à Nvu
Défendons nos valeurs, adhérons à l'APRIL
La Démocratie, c'est quand on frappe à votre porte à 6h00 du matin, et que c'est le laitier.
Ymai
Tyrannosaurus Rex
Messages : 4220
Inscription : 12 mars 2005, 11:36

Re: Mise en page de tableau

Message par Ymai »

Nonobstant la réponse précise et détaillée de mon éminent collègue amateur de Riesling (tiens, avec un magret, je n'aurais même pas eu l'idée), je persiste et signe.
Avec la feuille de style main.css qui suit, plus de bordures. Je mets toute la feuille de styles afin qu'il suffise de copier/coller l'ensemble sans chercher les deux éléments qui doivent être modifiés.

Code : Tout sélectionner

/*----------------------------------------------------------------------------
	main.css

	this css-file contains all definitions, that are independend from the
	colorschemes.

	(c) Schlund + Partner AG

	This CSS-File uses the original "Tanteks Box Modell Hack"
	http://www.tantek.com/CSS/Examples/boxmodelhack.html

	NOTE:
	Older W3C CSS validators return errors when the voice-family property
	is used in a 'screen' style sheet. This is an error in the W3C CSS
	validator itself. The validator should report a warning, not an error,
	when properties which are unsupported by a particular medium are used,
	and this has been reported to the W3C:

 ----------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------
 styles for specific classes and ids
----------------------------------------------------------------------------*/

body#main_body {
    margin: 0;
    padding: 7px 0px 0px 0px;
    text-align: center;
}

/*-- global container ------------------------------------------------------*/

#container {
    position: relative;
    padding: 0;
    margin: 0 auto;
    text-align: left;
    width: 910px;
}

#header {
    position: relative;
    padding: 0px 0px 0px 0px;
    margin: 10px 0px 10px 0px;
    width: 910px;
    height: 111px;
    top: 0px;
    left: 0px;
}

#main_container {
    position: relative;
    padding: 0px;
    /*margin: -75px 20px 20px 20px;*/

    margin: 0px 0px 0px 0px;
    left: -2px;
}

#layout_table {
    /*border-collapse: collapse;*/

    border-width: 0px;
    padding: 0px;
    margin: 0px;
}

#sub_nav_column {
    vertical-align: top;
    padding: 0px;
    margin: 0px;
    border-width: 1px;
    border-style: solid;
    border: 0;
}

#content_column {
    vertical-align: top;
    border-width: 1px;
    border-style: solid;
    border: 0;
}

#left_column_container {
    position: relative;
    top: 0px;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 173px;
}

#middle_div {
    position: relative;
    top: 0px;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 4px;
}

#sub_container1 {
    margin: 0px 11px 0px 13px;
    padding: 25px 0px 0px 0px;
}

#sub_container2 {
    margin: 0;
    padding: 25px 25px 75px 13px;
    width: 683px;
}

#content_container {
    overflow: hidden;
    margin: 0px;
    padding: 0;
    width: 683px;
}

#submenu_b {
    width: 173px;
    height: 13px;
    background-position: top;
    background-repeat: no-repeat;
    margin: 0px 0px 6px 0px;
    padding: 0px;
}

/*--- key visual -----------------------------------------------------------*/

#key_visual {
    /*clear: both;*/

    position: relative;
    top: 0px;
    left: 0px;
    width: 723px;
    height: 109px;
    float: right;
    /*margin-left: 261px;*/

    border-width: 1px;
    border-style: solid;
}

/*--- slogan (as text or background image) ---------------------------------*/

#slogan {
    position: relative;
    top: 0px;
    left: 0px;
    padding: 29px 15px 0px 17px;
    width: 691px;
    /*height: 47px;*/

    text-align: left;
    voice-family: "\"}\"";
    voice-family: inherit;
    /*margin-left: 209px;*/

}

html>body #slogan {
    width: 691px;
}

/*--- logo -----------------------------------------------------------------*/

#bg_logo {
    /*background: url(images/dynamic/logo.gif) no-repeat top right;*/

    background-repeat: no-repeat;
    width: 173px;
    height: 109px;
    position: relative;
    top: 0px;
    left: 0px;
    border-width: 1px;
    border-style: solid;
    margin-right: 10px;
}

#logo {
    /*background: url(images/dynamic/logo.gif) no-repeat top right;*/

    background-repeat: no-repeat;
    width: 145px;
    height: 85px;
    position: relative;
    top: 12px;
    left: 9px;
}

/*--- main navigation ------------------------------------------------------*/

#main_nav_container {
    z-index: 1;
    position: relative;
    top: 0px;
    left: 0px;
    line-height: 0;
    padding: 17px 0px 0px 0px;
    margin: 0 0 0px 0;
    overflow: hidden;
    width: 173px;
    voice-family: "\"}\"";
    voice-family: inherit;
    border-width: 0px;
}

html>body #main_nav_container {
    /*width: 555px;*/

}

#main_nav_list {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

#main_nav_list li {
    margin: 0;
    padding: 0;
}

/*--- main navigation items ------------------------------------------------*/

#main_nav_list a {
    overflow: hidden;
    margin: 0px 0px 0px 0px;
    /*padding: 3px 19px 2px 10px;*/

    display: block;
    voice-family: "\"}\"";
    voice-family: inherit;
}

html>body #main_nav_list a {
    /*height: 38px;*/

}

a.main_nav_item {
    padding-left: 35px;
    padding-right: 5px;
    line-height: 23px;
    text-align: left;
    width: 133px;
    height: 29px;
    background-position: top left;
    background-repeat: no-repeat;
}

a.main_nav_item:hover {
    padding-left: 35px;
    padding-right: 5px;
    background: transparent;
    line-height: 23px;
    text-align: left;
    width: 133px;
    height: 29px;
    background-position: top left;
    background-repeat: no-repeat;
}

a.main_nav_active_item {
    padding-left: 35px;
    padding-right: 5px;
    line-height: 23px;
    text-align: left;
    width: 133px;
    height: 23px;
    background-position: top left;
    background-repeat: no-repeat;
}

/*--- container for the subnavigation --------------------------------------*/

.sub_nav_container {
    position: relative;
    top: 0px;
    line-height: 0;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 173px;
    background-repeat: repeat-y;
}

/*--- subnavigation --------------------------------------------------------*/

.sub_nav_list {
    border: 0;
    margin: 0px 0px 0px 0px;
    padding: 0;
    list-style-type: none;
}

.sub_nav_list li {
    margin: 0px;
    padding: 0px;
    border: 0;
}

/*--- subnavigation items --------------------------------------------------*/

.sub_nav_list a {
    overflow: hidden;
    padding: 0px 5px 0px 45px;
    margin: 0px;
    display: block;
    voice-family: "\"}\"";
    voice-family: inherit;
}

html>body .sub_nav_list a {
    /*width: 165px;*/

}

a.sub_nav_item {
    text-align: left;
    line-height: 17px;
    height: 17px;
    width: 123px;
    background-repeat: repeat-y;
}

a.sub_nav_item:hover {
    text-align: left;
    line-height: 17px;
    height: 17px;
    width: 123px;
    background-repeat: repeat-y;
}

a.sub_nav_active_item {
    text-align: left;
    line-height: 17px;
    height: 17px;
    width: 123px;
    background-repeat: repeat-y;
}

/*--- footer ---------------------------------------------------------------*/

#footer {
    margin: 0px 0px 0px 0px;
    padding: 0;
    width: 910px;
    height: 39px;
    clear: both;
}

#footer_text {
    width: 880px;
    padding: 7px 20px 5px 10px;
    margin: 0 0px 0px 0px;
    text-align: right;
}

/*----------------------------------------------------------------------------
  default-styles for .content html-elements
----------------------------------------------------------------------------*/

/*--- paragraph ------------------------------------------------------------*/

.content {
    font-family: Arial, Verdana, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;
    margin: 5px 0 20px 0;
    padding: 0;
    line-height: 1.3;
}

.content p {
    margin: 5px 0 20px 0;
    padding: 0;
    line-height: 1.3;
}

.content table {
    font-family: Arial, Verdana, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;
    margin: 0px 0px 15px 1px;
    border-style: solid;
    border-width: 1px;
    border-spacing: 0;
    border-left: 1px solid;
    border-top: 1px solid;
    border-collapse: collapse;
}

.content select {
    font-family: Arial, Verdana, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;
}

.content input {
    font-family: Arial, Verdana, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;
    border-style: solid;
    border-width: 1px;
}

.content textarea {
    font-family: Arial, Verdana, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;
    border-style: solid;
    border-width: 1px;
}

/*--- headings -------------------------------------------------------------*/

/*--- links ----------------------------------------------------------------*/

.content a {
    font-family: Arial, Verdana, sans-serif;
    font-size: 100%;
    font-style: normal;
    font-weight: normal;
    text-decoration: underline;
}

/*--- tables ---------------------------------------------------------------*/

.content th {
    border-right: 1px solid;
    border-bottom: 1px solid;
    padding: 3px 5px 3px 5px;
}

.content td {
    border-right: 1px solid;
    border-bottom: 1px solid;
    padding: 3px 5px 3px 5px;
}

.content tr.odd {
    padding: 3px 2px 3px 2px;
}

.content tr.even {
    padding: 3px 2px 3px 2px;
}

/*--- forms ----------------------------------------------------------------*/

.content fieldset {
    padding: 15px;
    border-style: solid;
    border-width: 1px;
}

/*--- lists ----------------------------------------------------------------*/

/*--------------------------------------------------------------------------*/


Les deux éléments qui doivent donc être ajoutés sont:

#sub_nav_column {
vertical-align: top;
padding: 0px;
margin: 0px;
border-width: 1px;
border-style: solid;
border: 0;}
}

#content_column {
vertical-align: top;
border-width: 1px;
border-style: solid;
border: 0;}


Que ne ferait-on pour gagner sa choucroute...
Mit freundlichen Grüßen aussi
ymai
« Un enfant de cinq ans comprendrait cela ! Allez me chercher un enfant de cinq ans ! »
Groucho Marx.
chinon37
Animal mythique
Messages : 5319
Inscription : 21 mars 2005, 10:17

Re: Mise en page de tableau

Message par chinon37 »

A cause de la choucroute, pas du magret, parce qu'il s'agit d'un magret avec choucroute... Mais on s'égare, on s'égare... :D :roll:
Ymai a écrit :Que ne ferait-on pour gagner sa choucroute...
ça non plus, je ne l'aurais pas osé!! :D mais j'apprécie :lol:
Préferez Kompozer 0.8 à Nvu
Défendons nos valeurs, adhérons à l'APRIL
La Démocratie, c'est quand on frappe à votre porte à 6h00 du matin, et que c'est le laitier.
Maniulski
Arias
Messages : 4
Inscription : 27 sept. 2012, 09:21

Re: Mise en page de tableau

Message par Maniulski »

merci, problème réglé.
En fait la solution de Chinon37 était la bonne.
Maniulski
Arias
Messages : 4
Inscription : 27 sept. 2012, 09:21

Re: Mise en page de tableau

Message par Maniulski »

De nouveau le même problèmes. Cette fois ci sur d'autres pages...
Je me permets de vous demander encore un petit coup de main...
Merci

http://www.brasseriedefrance.de/Weihnac ... e2012.html
Votre Navigateur : Mozilla/5.0 (Windows NT 6.1; WOW64; rv:16.0) Gecko/20100101 Firefox/16.0
Ymai
Tyrannosaurus Rex
Messages : 4220
Inscription : 12 mars 2005, 11:36

Re: Mise en page de tableau

Message par Ymai »

Bonjour
Je relance d'un magret.
Il me semble que dans la feuille de style "main.css", la règle

Code : Tout sélectionner

.content table {
    font-family: Arial, Verdana, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;
    margin: 0px 0px 15px 1px;
    border-style: solid;
    border-width: 1px;
    border-spacing: 0;
    border-left: 1px solid;
    border-top: 1px solid;
    border-collapse: collapse;
}
doive être amputée (jusqu'à la cuisse -de canard) de

Code : Tout sélectionner

    border-style: solid;
    border-width: 1px;
Full aux as ? Ou capot?
Étonnamment, je ne suis pas contre un vieux Bourgueil avec un magret. Mais les puristes vont sans doute sortir du bois.
Votre Navigateur : Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:17.0) Gecko/20100101 Firefox/17.0
ymai
« Un enfant de cinq ans comprendrait cela ! Allez me chercher un enfant de cinq ans ! »
Groucho Marx.
Ymai
Tyrannosaurus Rex
Messages : 4220
Inscription : 12 mars 2005, 11:36

Re: Mise en page de tableau

Message par Ymai »

Aiguillettes de magret de canard avec poires et gelée d‘airelles rouges
C'est amusant, j'en ai cuisiné l'autre jour. Au sirop de Liège (Google est ton ami) et avec des poires aussi. Miam...
Ouuuupsssss.... Mais que font les modérateurs? Juste capable de siroter leur Chimay Bleue?
Votre Navigateur : Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:17.0) Gecko/20100101 Firefox/17.0
ymai
« Un enfant de cinq ans comprendrait cela ! Allez me chercher un enfant de cinq ans ! »
Groucho Marx.
chinon37
Animal mythique
Messages : 5319
Inscription : 21 mars 2005, 10:17

Re: Mise en page de tableau

Message par chinon37 »

Ymai a écrit :Mais que font les modérateurs? Juste capable de siroter leur Chimay Bleue?
Votre Navigateur : Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:17.0) Gecko/20100101 Firefox/17.0
Désolé, ils étaient à table :mrgreen:
Votre Navigateur : Mozilla/5.0 (Windows NT 6.1; WOW64; rv:18.0) Gecko/20100101 Firefox/18.0
Préferez Kompozer 0.8 à Nvu
Défendons nos valeurs, adhérons à l'APRIL
La Démocratie, c'est quand on frappe à votre porte à 6h00 du matin, et que c'est le laitier.
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Bing [Bot] et 10 invités