Profil qui s'affiche en largeur, mais pas en hauteur.
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Profil qui s'affiche en largeur, mais pas en hauteur.
Bonjour!
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : changement de code pour le profil
Lien du forum : https://thereverseworld.forumactif.com/
Merci d'avance pour votre aide...
Voici les visuels du problème
Ainsi que le template modifié:
Et le CSS:
Merci d'avance s'il vous est possible de nous aider
Détails techniques
Version du forum : phpBB2Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : changement de code pour le profil
Lien du forum : https://thereverseworld.forumactif.com/
Description du problème
Suite au changement de visuel de notre forum nous avons changer le code du profil, cependant, le profil s'affiche en largeur avec une scroll barre, et coupe les nombreuses informations, mais nous aurions aimer qu'il soit possible de "changer" le sens pour que tout s'affiche en hauteur afin que rien ne soit couper. Est-ce possible?Merci d'avance pour votre aide...
Voici les visuels du problème
Ainsi que le template modifié:
- Code:
<div class="profile_arte">
<div class="block_left_profile">
<div class="rank_profilemember">{POSTER_RANK}</div>
<div class="avatar_member_a">
{AVATAR_IMG}
</div>
<div class="infos_members">
<div>
dernière visite
</div>
<span>{LAST_VISIT_TIME}</span>
<div>
voir les
</div>
<span><a rel="nofollow" class="genmed" href="/spa/{PUSERNAME}">{L_POSTS}</a></span>
<div>
voir les
</div>
<span><a rel="nofollow" class="genmed" href="/sta/{PUSERNAME}">{L_TOPICS}</a></span>
</div>
<div id="online">{postrow.displayed.ONLINE_IMG}</div>
</div>
<div class="block_right_arte">
<div class="pseudo_member_a">
{L_VIEWING_PROFILE}
</div>
<div class="member_i_ch">
<!-- BEGIN profile_field -->
<div class="champ_profile">
{profile_field.LABEL}
<center><span>{profile_field.CONTENT}</span></center>
</div>
<!-- END profile_field -->
</div>
</div>
<div class="contact_profile">
<!-- BEGIN contact_field -->
{contact_field.LABEL} {contact_field.CONTENT}
<!-- END contact_field -->
</div>
</div>
<script src="{JQUERY_ROOT}json/jquery.json-1.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
$('[id^=field_id]').each(function(){
if ( $(this).find('.field_editable').is('span, div') )
{
$(this).hover(function()
{
if( $(this).find('.field_editable.invisible').is('span, div') )
{
$(this).find('.field_editable').prev().addClass('ajax-profil_hover').parent().addClass('ajax-profil_parent').append('<div class="ajax-profil_edit"><img src="{AJAX_EDIT_IMG}" /></div>');
$(this).find('.ajax-profil_edit').attr({
alt: "{L_FIELD_EDIT_VALUE}",
title: "{L_FIELD_EDIT_VALUE}"
}).click(function(){
$(this).prev().prev().removeClass('ajax-profil_hover').addClass('invisible').next().removeClass('invisible').append('<img src="{AJAX_VALID_IMG}" class="ajax-profil_valid" />').find('input,select');
$(this).prev().find('.ajax-profil_valid').attr({
alt: "{L_VALIDATE}",
title: "{L_VALIDATE}"
}).click(function(){
var content = new Array();
$(this).parent().find('[name]').each(function(){
var type_special = $(this).is('input[type=radio],input[type=checkbox]');
if ( (type_special && $(this).is(':checked')) || !type_special )
{
content.push(new Array($(this).attr('name'), $(this).attr('value')));
}
});
var id_name = $(this).parents('[id^=field_id]').attr('id');
var id = id_name.substring(8, id_name.length);
$.post(
"{U_AJAX_PROFILE}",
{id:id,user:"{CUR_USER_ID}",active:"{CUR_USER_ACTIVE}",content:$.toJSON(content),tid:"{TID}"},
function(data){
$.each(data, function(i, item){
$('[id=field_id' + i + ']').find('.field_uneditable').html(item).end().find('.ajax-profil_valid').remove().end().find('.field_editable').addClass('invisible').end().find('.field_uneditable').removeClass('invisible');
});
},
"json"
);
});
$(this).remove();
});
}
},function()
{
if( $(this).find('.field_editable.invisible').is('span, div') )
{
$(this).find('.field_editable').prev().removeClass('ajax-profil_hover');
$(this).find('.ajax-profil_edit').remove();
}
});
}
});
});
//]]>
</script>
Et le CSS:
- Code:
/**************************AFFICHAGE*PROFIL*********/
.profile_arte {
width: 850px;
height: 500px;
background: url(https://zupimages.net/up/17/46/t4i9.png);
margin: auto;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border: 2px solid #101010;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 20px;
color: white;
font: 10px calibri;
position: relative;
}
.block_left_profile {
width: 170px;
height: 320px;
}
.avatar_member_a {
border: 1px solid white;
border-radius: 0%;
width: 109px;
height: 173px;
padding: 20px;
position: relative;
margin-bottom: 20px;
}
.avatar_member_a img {
border-radius: 0%;
display: block;
position: relative;
z-index: 9;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
width: 109px;
height: 173px;
-o-object-fit: cover;
object-fit: cover;
}
.avatar_member_a img:hover {
-webkit-filter: grayscale(1);
filter: grayscale(1)
}
.infos_members {
text-align: center;
width: 140px;
}
.infos_members > div {
background: white;
color: black;
text-transform: uppercase;
margin-bottom: 2px;
margin-top: 10px;
padding: 2px;
}
.infos_members a {
text-decoratione: none !important;
color: white;
}
.block_right_arte
{
width: 620px;
height: 430px;
overflow: auto;
}
.pseudo_member_a {
width: 100%;
height: 50px;
font-size: 0;
letter-spacing: -2px;
text-transform: lowercase;
position: relative;
}
.pseudo_member_a span {
display: block;
font: 20px georgia;
text-transform: lowercase;
font-style: italic;
color: white;
}
.rank_profilemember {
display: block;
font: 10px calibri;
letter-spacing: 0;
text-transform: uppercase;
margin-top: -10px;
}
.pseudo_member_a:after {
content: " ";
border-top: 1px solid white;
width: 100%;
position: absolute;
right: 0;
bottom: 15px;
}
.member_i_ch {
height: 200px;
width: 100%;
-webkit-columns: 2;
-moz-columns: 2;
columns: 2;
line-height: 20px;
}
.champ_profile {
text-transform: uppercase;
border: 1px solid #1f1f1f;
padding: 2px;
background: #101010;
margin: 3px;
}
.champ_profile:first-child {
margin-top: 0;
}
.member_i_ch span {
text-transform: uppercase;
}
.field_uneditable {
display: inline-block;
}
.contact_profile {
padding: 5px;
background: #1f1f1f;
width: 830px;
height: 30px;
position: absolute;
bottom: 0;
left: 0;
font-size: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.contact_profile a {
margin: 0 3px;
}
Merci d'avance s'il vous est possible de nous aider
Dernière édition par Trw le Sam 24 Oct 2020 - 19:02, édité 1 fois
Re: Profil qui s'affiche en largeur, mais pas en hauteur.
Hello Trw,
dans ta feuille de style, tu as ceci:
Supprimes ces trois lignes:
a++
dans ta feuille de style, tu as ceci:
- Code:
.member_i_ch {
height: 200px;
width: 100%;
-webkit-columns: 2;
-moz-columns: 2;
columns: 2;
line-height: 20px;
}
Supprimes ces trois lignes:
- Code:
-webkit-columns: 2;
-moz-columns: 2;
columns: 2;
a++
Invité- Invité
Re: Profil qui s'affiche en largeur, mais pas en hauteur.
merci beaucoup !
Tu nous sauves la vie!
Je met en résolu!
Tu nous sauves la vie!
Je met en résolu!
Sujets similaires
» Hauteur et largeur des cellules de forum
» Régler la hauteur et la largeur de mes cadres
» Hauteur largeur cellule topic
» hauteur et largeur sous forum en phpbb3
» Largeur du forum Ok mais les pages des sujets trop large, comment faire ?
» Régler la hauteur et la largeur de mes cadres
» Hauteur largeur cellule topic
» hauteur et largeur sous forum en phpbb3
» Largeur du forum Ok mais les pages des sujets trop large, comment faire ?
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum