Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1291 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [CSS] probleme hauteur de cadre

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[CSS] probleme hauteur de cadre

n°1251093
kaillou38
mouton à numéro
Posté le 22-11-2005 à 22:01:18  profilanswer
 

bonjour
 
vu que le premier design ne plaisait a personne sauf a moi, je refais un truc complet, avec un graphique un peu plus avancé...
 
ca avance pas mal, mais j'ai un souci avec un bloc de cadre qui veut pas faire ca hauteur, et ce depuis hier soir, je commence a en avoir ras le bol :(
 
pour que vous voyez de vous meme : www.kaillou.net/new
 
sur le bloc de bienvenue, les hauteurs ne s'ajustent pas correctement
 
j'ai utilser un bloc pour faire la partie haut avec a l'interieur d'autres blocs pour chaque element
 
meme chose pour la partie du milieu, et celle qui forme le bas du cadre
 
 
donc j'ai mon bloc milieu qui s'ajuste en fonction du texte qu'il contient, et a l'interieur, le bloc qui contient ce dit texte, et deux vlocs de chaque coté pour faire les bords du cadre
 
et ces bords font de la merde
 
je pensais que en mettant juste des margin a 0, ca ferai ce que je veux, et ben non
et un height: 100%; ne marche pas non plus :(
 
je met le bout de code pour ce morceau :
(la, celui de gauche a une taille fixe pour voir comment il se positionne)
 
html

Citation :

<div class="corps-boite">    
      <div class="tranche-milieu-gauche"></div>
      <div class="tranche-milieu-droit"></div>
      <div class="centre-corps">
          ce site est "optimisé" pour les navigateurs respectant les normes du web, donc ceux utilisant encore internet explorer, veuillez cliquer  
          <a href="http://www.mozilla.fr">ici</a><br />
          Bon surf (bien que tres limité pour le moment)</div></div>


css

Citation :

.corps-boite
{  
  margin:0px;
  padding:0px;
  border: 0px solid;
  }
 
.tranche-milieu-gauche
{  
  border:0px solid;
  float:left;
  margin: 0px;
  padding: 0px;
  width: 16px;
  height: 50px;
  background-image: url("kaillou_fichiers/tranche-milieu-gauche.png" ) !important;
  background-image: url("kaillou_fichiers/tranche-milieu-gauche-ie.png" );
  background-repeat: repeat-y;  
  }
 
.centre-corps
{  
  margin: 0px;
  margin-right:16px;
  margin-left:16px;
  padding: 0px;
  background-color: #d7dffe;  
  }
 
.tranche-milieu-droit
{  
  float:right;
  margin: 0px;
  padding: 0px;
  width: 16px;
  border:0px solid;
  background-image: url("kaillou_fichiers/tranche-milieu-droit.png" ) !important;
  background-image: url("kaillou_fichiers/tranche-milieu-droit-ie.png" );
  background-repeat: repeat-y;  
  }


 
 
autre question au passage : pourquoi IE me coupe ma page completement parfois a la fin de l'ecran, le scroll ne servant a rien (ceux qui l'ont eut comprendront sans probleme)
 
merci


Message édité par kaillou38 le 22-11-2005 à 22:06:23

---------------
ras
mood
Publicité
Posté le 22-11-2005 à 22:01:18  profilanswer
 

n°1251105
omega2
Posté le 22-11-2005 à 22:37:44  profilanswer
 

Ce que j'ai dans un de mes templates et qui marche trés bien :

Code :
  1. .pffff {
  2.   line-height: 0px
  3. }
  4. td.right-bottom-fill {
  5.   background-image: url(./images/right-fill.png);
  6.   margin: 0;
  7.   height:100%;
  8.   vertical-align: bottom;
  9. }


et dans la page html

Code :
  1. <td class="pffff right-bottom-fill"><img src="./modele/beos6/images/right-bottom-back.png" alt="" /></td>


 
Je te laisses essayer les différences entre nos deux css. Si je me suis pas planté, je t'ai copier la partie qui permet d'agrandir une image sur toute la hauteur de la zone. S'il y a une image visible et une autre en fond, c'était pour avoir un effet de coin qu'a une taille fixe sans espace entre ce coin et le côté de l'ensemble.
 
PS : Je sais, les tables de présentation, c'est mal mais ce template est vieux, mais je l'indique par ce qu'il correspond à ce qu'il essaye de faire. ;)

n°1251123
kaillou38
mouton à numéro
Posté le 22-11-2005 à 22:53:20  profilanswer
 

les seuls differences que je vois, c'est le line-height:0px qui a pour effet de me mettre l'epaisseur du bloc texte a 0 : pas tres pratique, et le vertical-align: bottom; qui n'a aucun effet chez moi :(
 
par contre, le fait de foutre deux classes pour un meme element est sympa, je connaissais pas, et ca me donne des idées :D
(bon pas pour mon probleme actuel :( )


---------------
ras
n°1251185
omega2
Posté le 23-11-2005 à 00:15:43  profilanswer
 

Sauf erreur de ma part, t'as pas de texte dans le div contenant l'image qui se retaille pas, essaye donc le line-heigth quelques minutes voir si par miracle ca corrige pas ton probléme.
Je sais que moi aussi j'avais eu le même probléme que toi à moment donnée et si la solution est pas là, alors je fouillerait d'avantage mon modéle pour retrouver où se cache l'élément manquant.

n°1251188
kaillou38
mouton à numéro
Posté le 23-11-2005 à 00:23:06  profilanswer
 

ben, j'ai essayé dans le div conteneur (.corps-boite) ou il y a l'ensemble des element
 
et dans celui ou il y a la tranche (.tranche-milieu-gauche ou droite), et les deux ne font rien (enfin celui dans le conteneur me met tout le bloc a une hauteur de 0)
 
par contre un truc bizarre, c'est que ff me fait un cadre de 0 de haut, et ie fait un cadre d'environ 10px...
 
en tout cas je te remercie de ton aide


Message édité par kaillou38 le 23-11-2005 à 00:23:42

---------------
ras

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [CSS] probleme hauteur de cadre

 

Sujets relatifs
problème génération xml avec phpproblème d'écriture sur le disque
Problème d'arrondi, somme de pourcentage au dela de 100%Changement de couleur du texte via CSS
problème avec Thread.sleep() dans des tests Junit...menu fixed CSS
Problème Css calque sous dreamweaverProblème VB (débutant...)
aide pour un probléme 
Plus de sujets relatifs à : [CSS] probleme hauteur de cadre


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR