28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Lorsque je veux redimensionner ma fenêtre, j'ai un problème au niveau de mon tableau et de mon menu, ils ne se redimensionnent pas.

Voici mon code HTML:

<div id="main">
  <div id="text_border">
    ...
  </div>
  <div id="header">
  ...
  </div>
  <div id="content">
    <div id="leftcontent">
      [#red]<ul id="folders">
        <li>
          <a class="selected" href="produits.html">
            <img src="images/folder_icon.png" />
            <p id="lien1">Produits</p>
          </a>
        </li>
        <li>
          <a href="lieux.html">
            <img src="images/folder_icon.png" />
            <p id="lien2">Lieux</p>
          </a>
        </li>
        <li>
          <a href="medias.html">
            <img src="images/folder_icon.png" />
            <p id="lien3">M&eacute;dias</p>
          </a>
        </li>
      </ul>
      <div id="operations">
        <h3>Op&eacute;rations en cours</h3>
        <table>
          <tr>
            <td>chardonay.jpg</td>
            <td>Uploaded</td>
          </tr>
          <tr>
            <td>riesling.jpg</td>
            <td>Uploaded</td>
          </tr>
          <tr>
            <td>sauterne.jpg</td>
            <td>58%<td>
          </tr>
          <tr>
            <td>grandcrubrand.jpg</td>
            <td>25%</td>
          </tr>
          <tr>
            <td>grandcrufroehn.jpg</td>
            <td>12%</td>
          </tr>
        </table>
      </div>[/#]
    </div>
    <div id="maincontent">
      ...
    </div>
  </div>
</div>


Et voici un bout de mon code CSS:

body
{
	border: 5px solid ForestGreen;
	float: left;
	width: 100%;
}

#main
{
	width: 75%;
	margin-right: auto;
	margin-left: auto;
	overflow: hidden;
}

#content
{
	float: left;
}

#leftcontent
{
	width: 25%;
	float: left;
} 

ul#folders a
{
	text-decoration: none;
	color: #2281CF;
}

ul#folders li
{
	list-style-type: none;
	width: 50%;
	margin-bottom: 5px;
}

ul#folders li p
{
	float: right;
	margin-top: 5px;
	margin-bottom: 5px;
}

ul#folders li p#lien1
{
	margin-right: 25px;
}

ul#folders li p#lien2
{
	margin-right: 57px;
}

ul#folders li p#lien3
{
	margin-right: 43px;
}

#leftcontent .selected
{
	color: black;
	font-weight: bold;
}


ul#folders li img
{
	width: 20%;
}

#operations
{
	margin-top: 100px;
	width: 80%;
}

#operations h3
{
	text-align: center;
	margin-top: 0px;
	margin-bottom: 0px;
	height: 30px;
	line-height: 30px;
	background-color: rgb(32,32,32);
	color: white;
	margin-left: auto;
	margin-right: auto;
}

#operations table
{
	width: 100%;
	border: 1px solid silver;
}

#operations table, #operations table tr
{
	border-collapse: collapse;
	border-bottom: 1px solid silver;
}

#operations td
{
	padding-right: 0px;
	padding-left: 0px;
}


Comment faire pour que mon tableau et mon menu se redimensionnent correctement?

Merci.
Hello,
j'ai recup ton code, et testé en local... mais je ne comprends pas ce que tu veux faire...
Tu peux poster un lien ? ou alors des screens explicitant ce que tu veux parce que la...