Home/ Questions/Q 8808665
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T02:40:51+00:00

I’ve been recently working on a simple web page. I would like to place

  • 0

I’ve been recently working on a simple web page. I would like to place almost all style info in the CSS file. The main layout of the page is a table. I looks like this: 

<body>
<table class="glowna">
<tr>
  <td colspan="2">...</td>
</tr>
<tr>
  <td id="glowna_top" colspan="2">
    <ul class="menu_gorne">
      <li>..</li>
    </ul>
  </td>
</tr>
<tr>
  <td id="glowna_menu_lewe">
    <ul class="menu_lewe">
      <li>...</li>
    </ul>
  </td>
  <td id="glowna_main">
      ...
  </td>
</tr>
</table>
</body>

and the CSS is like:

ul.menu_lewe, ul.menu_gorne {
  display:block; list-style:none;margin:0;}
ul.menu_lewe { 
  width:200px; padding:2px 20px 2px 2px;
  background-color:#9ce;border:none; vertical-align:top;}
ul.menu_lewe li { 
  border-bottom:1px solid #9ce; }
ul.menu_lewe a:link, ul a:visited { 
  display:block;width:176px;text-decoration:none;padding:7px;font-  weight:bold;background-color:#27c;color:#def;border-right:10px solid #25b;border-left:5px solid #25b; }
ul.menu_lewe a:hover { 
  width:176px;background-color:#28e;color:#fff;border-right:20px solid #26d; }
ul.menu_gorne { 
  position:absolute; }
ul.menu_gorne li { 
  float:left;padding:2px 2px 2px 2px;background-color:#9ce;border:none; }
ul.menu_gorne a:link, ul a:visited { 
  text-decoration:none;display:block;width:200px;text-align:center;padding:5px 0;font-weight:bold;background-color:#27c;color:#def;border-top:10px solid #25b; }
ul.menu_gorne a:hover { 
  background-color:#28e;color:#fff;border-top:20px solid #26d; }
ul.lista_dostawcow {
  width:800px;}
table.glowna { 
  background-color:#9ce;table-layout:fixed;width:1024px;margin-left:auto;margin-right:auto; }
td#glowna_top { 
  height:55px; vertical-align:top;}
td#glowna_main { 
  width:824px; text-align:left;}
td#glowna_menu_lewe { 
  width:200px;}

The problem is:
1. that even I set all the widths I still get table cells: “glowna_menu_lewe” and “glowna_main” divided 50%:50%. I want cell “glowna_menu_lewe” to be only 200px or sth near and the other one may fill the rest of space.

2. I would like to place list “menu_lewe” on top of its cell. Now it is vertically centered even that I set the verical-align attribute to top.

Sorry for posting so much code but I didn’t know what may be causing the problem.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    1 – Change that :

    table.glowna { 
  background-color:#9ce;
  table-layout:fixed;
  width:1024px;
  margin-left:auto;
  margin-right:auto; 
}
td#glowna_main { 
  width:824px;
  text-align:left;
}

    to this :

    table.glowna { 
  background-color:#9ce;
  width:1024px;
  margin-left:auto;
  margin-right:auto;
}
td#glowna_main { 
  text-align:left;
}

    2- use valign="top" attribute to td tag instead of vertical-align:top;

    • 0