28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai des problèmes sur un site ou l'impression de la page ne marche pas tres bien. En effet mes textes sont coupés (sur le coté), il y a des saut de pages inopinés...(en bas de la seconde page). Et j'ai du mal a savoir comment régler
cela.

upload/1487881402-49422-14878566621838impression.jpg

Si vous avez une idée, elle est la bienvenue Smiley smile

Ci apres la feuille de style du print :

*/
 
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
 
 
@page { size: portrait; } ;
@page { margin: 2cm } /* All margins set to 2cm */
 
html{font-family: arial;
font-size: 14px;
}
 
body {
    background: white;
    font-size: 12pt;
}
     
#menu {
    display: none;
}
     
#wrapper,
#content {
    width: auto;
    margin: 0 5%;
    padding: 0;
    border: 0;
    float: none !important;
    color: black;
    background: transparent none;
}
     
div#content {
    margin-left: 10%;
    padding-top: 1em;
    border-top: 1px solid #930;
}
     
div#mast {
    margin-bottom: -8px;
}
     
div#mast img {
    vertical-align: bottom;
}
     
a:link,
a:visited {
    color: #520;
    background: transparent;
    font-weight: bold;
    text-decoration: underline;
}
     
#content a:link:after,
#content a:visited:after {
    content: " (" attr(href) ") ";
    font-size: 90%;
}
     
#content a[href^="/"]:after {
    content: " (http://www.alistapart.com" attr(href) ") ";
}
Administrateur
Bonjour,

juste pour voir si ça règle quelque chose, tu pourrais tester
* { float: none !important; }

Est-ce que tu as des tableaux ou du display: table(-*) ? Du positionnement absolu, relatif, autre chose que du display: block ? Smiley lol