boas, eu agora ando aos poucos a apreder mais de css, mas tenho aqui um problema que não faço a minima como fazer.
eu tenho o site a 100%, e depois no body tenho 1 div 1 uma lista, em que um elemento está alinhado a direita e outro a esquerda, mas o problema é que se o site for visto num browser de 1024px, a tabela encolhe, ou a barra passa para baixo da tabela.
fica aqui o codigo
Código :
código mais importante adicionado
Código (HTML5):
Código (CSS):
eu tenho o site a 100%, e depois no body tenho 1 div 1 uma lista, em que um elemento está alinhado a direita e outro a esquerda, mas o problema é que se o site for visto num browser de 1024px, a tabela encolhe, ou a barra passa para baixo da tabela.
fica aqui o codigo
Código :
https://cloudpt.pt/link/55631b3b-bd1c-43b3-9b8b-b5bba38ac906/feed.rar
código mais importante adicionado
Código (HTML5):
<div id="geral">
<ul>
<li class="geral_esquerda color_grey">
<table class="ink-table hover">
<tr>
<a href="Javascript:alert('111');" style="float:right; text-decoration:none; margin-right:0px; padding-left:10px; cursor:pointer;"><i class="icon-arrow-left"></i></a>
<td>1</td>
</tr>
<tr>
<td>2</td>
</tr>
<tr>
<td>3</td>
</tr>
</table>
<!--</div>-->
</li>
<li class="geral_direita">
<nav class="ink-navigation ">
<ul class="breadcrumbs orange flat rounded and shadowed">
<li><a href="#">Start</a></li>
<li><a href="#">Level 1</a></li>
<li><a href="#">Level 2</a></li>
<li class="active"><a href="#">Current item</a></li>
</ul>
</nav>
</li>
</ul>
</div>
<ul>
<li class="geral_esquerda color_grey">
<table class="ink-table hover">
<tr>
<a href="Javascript:alert('111');" style="float:right; text-decoration:none; margin-right:0px; padding-left:10px; cursor:pointer;"><i class="icon-arrow-left"></i></a>
<td>1</td>
</tr>
<tr>
<td>2</td>
</tr>
<tr>
<td>3</td>
</tr>
</table>
<!--</div>-->
</li>
<li class="geral_direita">
<nav class="ink-navigation ">
<ul class="breadcrumbs orange flat rounded and shadowed">
<li><a href="#">Start</a></li>
<li><a href="#">Level 1</a></li>
<li><a href="#">Level 2</a></li>
<li class="active"><a href="#">Current item</a></li>
</ul>
</nav>
</li>
</ul>
</div>
Código (CSS):
@charset "utf-8";
/* CSS Document */
body
{
width:100%;
font-family: Ubuntu, Arial, Helvetica, Sans-serif;
}
/*barra de menu*/
#geral
{
margin:0px;
padding:0px;
height:100%;
width:100%;
}
#geral ul
{
display:block-inline;
position:relative;
padding:0px;
margin:0px;
}
.geral_esquerda
{
float:left;
list-style:none;
margin:0px;
padding:0px;
/*width:250px;*/
width:13%;
min-width:13%;
}
.geral_direita
{
float:right;
list-style:none;
padding:0px;
margin:0px;
width:80%;
}
/* CSS Document */
body
{
width:100%;
font-family: Ubuntu, Arial, Helvetica, Sans-serif;
}
/*barra de menu*/
#geral
{
margin:0px;
padding:0px;
height:100%;
width:100%;
}
#geral ul
{
display:block-inline;
position:relative;
padding:0px;
margin:0px;
}
.geral_esquerda
{
float:left;
list-style:none;
margin:0px;
padding:0px;
/*width:250px;*/
width:13%;
min-width:13%;
}
.geral_direita
{
float:right;
list-style:none;
padding:0px;
margin:0px;
width:80%;
}