CSS width proportionnel

CSS width proportionnel - HTML/CSS - Programmation

Marsh Posté le 27-08-2012 à 11:38:32    

Bonjour,
 
Je cherche à obtenir le résultat d'un calcul dans un width, genre  
 
width: (100% - 11.6em);
 
mais ça ne fonctionne pas.
 
Comment faire ?
 
Merci d'avance.

Reply

Marsh Posté le 27-08-2012 à 11:38:32   

Reply

Marsh Posté le 27-08-2012 à 11:48:14    

C'est impossible à faire tel quel, il faut un peu bricoler.  
 
Tu devrais pouvoir t'en sortir en jouant un peu avec les marges et le padding (en ajoutant éventuellement un div supplémentaire autour de ton bloc). Donne un bout de ton code si tu as besoin d'un coup de main.

Reply

Marsh Posté le 27-08-2012 à 11:52:45    

Merci ;)
 

Citation :

div#content {
 margin-left: 12.2em;
 margin-top: 2.5em;
 margin-right: 0;
 padding: 0 1em 1em 1em;
 position: absolute;
 z-index: 2;
 background: white;
 width: 100%;
 color: black;
 border: 2px solid #aaa;
 /* border-right: none; */
 line-height: 1.5em;
}
 
div#column-one {
 padding-top: 160px;
}
div#column-content {
 width: 85%;      
 float: none;
 margin-top: .6em;
 margin-bottom: 0;
 padding: 0;
 position: relative;
}


 
Avec le content pour cadre flottant de 90% de large de l'écran, marge de 5% pour le centrer et il contient une colonne à taille fixe (column-one) et je cherche à faire que column-content occupe le reste de content, quelle que soit la taille de l'écran du client.
 
Je bricole depuis des heures sans succès  :fou:

Reply

Marsh Posté le 28-08-2012 à 10:22:03    

Et le html correspondant ? Ou mieux, crée un jsfiddle avec ton code (http://jsfiddle.net )
 
Mais à priori, ton approche me semble mauvaise. Le positionnement absolu et le z-index ne devrait pas être nécessaire pour ce que tu veux faire.

Reply

Marsh Posté le 28-08-2012 à 11:20:23    

En fait j'essaye de faire un skin pour mediawiki, mais j'en bave pire qu'un troupeau d'escargots...
 
Je vais faire du html avec des <table> si ça continue.  :fou:  
 
mediawiki c'est vraiment une prise de tête sans nom dès que tu veux le customiser un minimum :(

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed