| Le problème avec un rétrécissement du forum. [résolu] | |
|
Moonsun
{ Membre }
Messages : 29
| Bonjour , Lorsque je veux réduire l'avatar forum est un en-tête et aller au-delà de la colonne. https://i.servimg.com/u/f40/17/60/27/78/proble10.jpg Puis-je empêcher ce en quelque sorte? Css, html? Mon code css - Spoiler:
- Code:
-
#wrap { margin-top: -35px; margin-bottom: -25px; border-left: 2px solid #A27F6E; border-right: 2px solid #A27F6E; box-shadow:1px 1px 3px #7A6458; }
blockquote { background-color:#FEF2E2; border:1px dotted #DCCFBD; }
.content blockquote { color:#4E3929; font-family:Helvetica; font-size:12px; }
dl.codebox { background-color:#FEF2E2; border-left:2px solid #DCCFBD; border: 1px dotted #DCCFBD; margin-left: 25px; }
dl.codebox code { color:#4E3929; font-family: trebuchet MS; font-size: 11px; padding-left: 15px; } dl.codebox dt { border-bottom-width: 1px dashed #FFFFFF;}
.module .h3 { visibility:hidden; margin-top:-1px; } .module { -moz-border-radius:30px 30px 30px 30px; border-radius:30px 30px 30px 30px; background-color:none; }
#content-container div#left { background:url('http://i44.servimg.com/u/f44/16/74/68/54/pattvi11.jpg'); border-top: 4px solid #e0cbc1; border-left: 1px solid #e0cbc1; border-right: 1px solid #e0cbc1; border-bottom: 4px solid #e0cbc1; margin-top:-40px; margin-left:7px; box-shadow: 0 0 6px #COLOR; border-bottom-right-radius: 40px; border-top-left-radius: 40px; }
#chatbox_header { background: url("http://i672.photobucket.com/albums/vv90/shes_a_skeeze/layouts%20and%20patterns/df470c43.png"); -moz-border-radius: 30px 30px 0 0; border-radius: 30px 30px 0 0; }
.chatbox-title { font-size:18px; letter-spacing:2px; text-shadow:0 2px 2px #000000; font-family:Georgia; font-weight:normal; }
li.header dl.icon { -moz-border-radius: 25px 25px 0 0; border-radius: 25px 25px 0 0; background: url(""); border-bottom:2px dotted #614116; font-size:10px; letter-spacing:-1px; padding:6px 0 1px; text-align:center; text-shadow:0 2px 2px #A27F6E; vertical-align:middle; } h1.page-title { -moz-border-radius: 25px 25px 0 0; border-radius: 25px 25px 0 0; background: url("http://i672.photobucket.com/albums/vv90/shes_a_skeeze/layouts%20and%20patterns/df470c43.png"); border-bottom:2px dotted #614116; font-family:Georgia; font-size:24px; text-align: center; }
.table-title, .table-title h2 { color: #594136; font-family:Georgia; font-size:24px; text-transform:lowercase; font-style:italic; }
.textarea { -moz-border-radius:20px 20px 20px 20px; background-color:#FEF2E2; color:#8F8F8F; font-family:georgia; font-size:9px; height:50px; opacity:0.5; width:170px; } input{ font-size: 9px; font-family: trebuchet ms; verdana, helvetica, sans-serif; background-color: EDEDED; vertical-align: middle; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px 20px 20px 20px; color: #3e3e3e }
a.forumtitle { border-bottom: 2px dotted #806151; font-family: georgia; font-style: italic; text-aling: center; text-shadow: #806151 1px 1px 2px; font-weight:normal; letter-spacing: 1px; font-size: 16px; color: #4d3838; margin-left: 10px; }
#page-header ul.linklist li a { -moz-border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px; background-color:#DCCFBD; font-family:georgia; font-style: none; text-transform:lowercase; }
#page-header ul.linklist li a:hover { text-decoration:none; letter-spacing: 1px; }
p.author { background-color: #DCCFBD; border-radius: 6px 6px 6px 6px; -moz-border-radius: 6px 6px 6px 6px; margin-top: 20px; padding: 3px !important; position: relative; right: -7em; text-align: center; }
p.author { font-family: Arial,Helvetica,sans-serif; font-size: 1em; line-height: 1.2em; margin-top: 15px; padding: 0 0 5px; } p em b a.gensmall { font-family: georgia; font-size: 20px; font-style: italic; font-weight: normal; text-shadow: 0 0 4px #DCCFBD; text-transform: lowercase; letter-spacing:-3px; }
p em { font-style: normal; color: transparent; }
.postprofile a:link, .postprofile a:active, .postprofile a:visited, .postprofile dt.author a { font-size: 2em; font-style: italic !important; font-family: georgia; text-decoration: none; letter-spacing: -2px; text-align: center; }
.desc3 { background-image: url("http://i44.servimg.com/u/f44/16/74/68/54/pattvi11.jpg"); border-top: 4px solid #e0cbc1; border-left: 1px solid #e0cbc1; border-right: 1px solid #e0cbc1; border-bottom: 4px solid #e0cbc1; border-radius:0px 30px 0px 30px; text-transform: uppercase; font-size: 8px; Font-family: Century Gothic; color: #352c2c; display: block; line-height: 9px; margin-left: 15px; margin-top: 5px; padding: 10px; text-align: justify; width: 350px; } .formdesc a:link, .formdesc a:visited, .formdesc a:active { border-bottom: 1px dotted; background-color: none; color: #000000; font-family: Arial; font-size: 8px; letter-spacing: 1px; padding: 1px; text-transform: uppercase; }
.formdesc { background-color: #COLOR; border-radius: 30px 30px 30px 30px; background-color: #e0cbc1; display: block; font-size: 8px; margin-top: 10px; padding: 3px; text-align: center; }
|
Dernière édition par Moonsun le Ven 22 Juin 2012, 06:29, édité 1 fois | |
|
| |
Doare
{ Spécialiste }
Messages : 544
| Hey! Je n'ai pas compris ce que tu essayes de faire. Peux-tu réexpliquer ? Peut-on aussi avoir le lien du forum, si possible ? Merci. | | |
|
| |
Moonsun
{ Membre }
Messages : 29
| Ok Lien: http://caputdraconis.forumpl.net/t3-rezerwacja-wygladu-postaci#3 When I minimize the browser window to a header and go beyond the forum avatar. The problem stops when I change the avatar place from right to left. But I would like to have an avatar on the right forum. C: | | |
|
| |
Doare
{ Spécialiste }
Messages : 544
| Okay, I'll take a look then. I'll get back to you when I've figured out what's wrong. | | |
|
| |
Moonsun
{ Membre }
Messages : 29
| |
| |
Doare
{ Spécialiste }
Messages : 544
| Sooo... First and foremost, you will have to set a fixed width to your forum. Currently, it's set to a relative value, "68%". Since the header is pretty large, when you reduce your window, the header sticks out. To get it to stay in, you need a fixed width and some CSS to fix the padding. To fix the forum's width, you'll need to change the setting in the administration panel. Shouldn't very different in English (in which I'm guessing your panel is) : General > Forum : Configuration In the second section is supposed to be the forum's width. Set the following: 800px Then add this in your CSS : - Code:
-
.headerbar, #logo { padding:0; } Concerning the avatar, it's kind of the same. The profile's and post's widths are set to relative values, so the avatar may be large, the profile just won't care. It does the same when it's on the left, it's just less obvious. We'll just use a few lines of CSS to fix that. But before we get into it, in the CSS you provided, there's something missing, isn't it? I found this also: I was kind of wondering where weird stuff was coming from (for the "postprofile"). I guess it was from there. (You're working on it as I'm checking it out, aren't you? XD) Anyway, first, of course, you need to select the side you want the profile on, in the administration panel. It's in the exact same place as the forum's width. Once it's done, add the following to your CSS: - Code:
-
.postprofile { width:210px; /* avatar's width + 10px to have some space */ } .postbody { width:71%; /* reduce the post's width a little bit */ } In the code you've already added to "postprofile", the only proprieties you should keep are "margin-top" and "padding-top". The rest of it is either irrelevant or already in the default CSS. Anyway. If you follow those steps, it should work nicely. | | |
|
| |
Moonsun
{ Membre }
Messages : 29
| I used everything as you wrote, but now the text overlaps avatar :
http://caputdraconis.forumpl.net/t4-lorem-impsum#4
Both on the left or right side. | | |
|
| |
Doare
{ Spécialiste }
Messages : 544
| Well I see you did set the fixed width, but I can't see anything else. Plus the profile's still on the left. Did you check the option in the panel (same place as the forum's width)?
I can't see the CSS rules I gave you. Maybe the panel reset to the main page when you updated the CSS? It happens when you stay on the page for too long without doing anything; then it doesn't take your changes into account and you have to do it again. | | |
|
| |
Moonsun
{ Membre }
Messages : 29
| I added this to the css: - Code:
-
.headerbar, #logo { padding:0; }
.postprofile { width:210px; /* avatar's width + 10px to have some space */ } .postbody { width:71%; /* reduce the post's width a little bit */ } Profile on the left and the right overlaps the text. Maybe I did something wrong, but no matter what I had to remove something from your code? | | |
|
| |
Doare
{ Spécialiste }
Messages : 544
| From yours actually. See, you've got this in your CSS: - Code:
-
.postprofile { display: inline; float: left; margin-left: -15px; margin-top: 30px; min-height: 100px; padding-top: 10px; position: relative; } Most of it is, as I said, useless: - Code:
-
.postprofile { display: inline; /* already by default */ float: left; /* float is set by the forum; adding this causes bug */ margin-left: -15px; /* causes the overlap */ margin-top: 30px; min-height: 100px; /* already by default */ padding-top: 10px; position: relative; /* already by default */ } Just delete the ones I commented. ^^ | | |
|
| |
Moonsun
{ Membre }
Messages : 29
| It works! I have one little question. How could I change nickname (login) to fit into one line? Now nick is on two lines (Rudolfine McLaggen). | | |
|
| |
Doare
{ Spécialiste }
Messages : 544
| Well I suggest you reduce the font-size of the nickname. You find it here in your CSS: - Code:
-
.postprofile a:link, .postprofile a:active, .postprofile a:visited, .postprofile dt.author a { font-size: 2em; font-style: italic !important; font-family: georgia; text-decoration: none; letter-spacing: -2px; text-align: center; } | | |
|
| |
Moonsun
{ Membre }
Messages : 29
| thank you | | |
|
| |
Doare
{ Spécialiste }
Messages : 544
| You're welcome! If everything's okay now, add [résolu] in the topic's title for the moderators. | | |
|
| |
Psycho
Psychopathe
Messages : 3407
| Hi (: I can see that the problem is solved. Thanks for informing | | |
|
| |
Contenu sponsorisé
| |
| |
| Le problème avec un rétrécissement du forum. [résolu] | |
|