Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

RicardoMonteiro232

Problemas Com o Border

Recommended Posts

Eu estou aprendendo sozinho a fazer um site e quando eu uso o comando border para dar destaque ao elemento só funciona no Firefox e seus Derivados, não funciona nos navegadores que usam WebKit como motor gráfico. Como eu faço para resolver esse problema??

Compartilhar este post


Link para o post
Compartilhar em outros sites
<html>

<head>

<script type="text/javascript" src="js/jquery-1.4.2.js"></script>

<script type="text/javascript" src="js/coin-slider.min.js"></script>

<link rel="stylesheet" type="text/css" href="css/coin-slider-styles.css">

<meta charset="UTF-8">

<title>SoftBr - Início</title>

</head>

<body>

<div id='menu1' style="height: 60px; width: 1366px;">

<a href="index.html" style="float: left; margin-left: 10%;"><img src="img/sbr.png"></a>

<a href="windows.html" style="float: left; margin-left: 5%;"><img src="img/windows.png"></a>

<a href="ubuntu.html" style="float: left; margin-left: 0.5%;"><img src="img/ubuntu.png"></a>

<form action="http://www.mxmasters.com.br" method="get" style="float: left; margin-left: 40%; margin-top: 10px;">

<label>

<input name="s" id="s" value="" type="text" style="background: #eee; padding:10px; border-radius:10px 0 0 10px; border:0.5px solid #2beb05; width:150px;">

</label>

<button type="submit" class="btnSearch" style="border: 1px solid #222; color: #eee; padding-left:10px; padding-top:10px; background: #4591fa; border-radius: 6px; ; color:#fff; font: 'trebuchet ms', trebuchet; padding:10px 20px; border-radius:0 10px 10px 0; border:0 none; font-weight:bold;">Buscar</button>

</form>

</div>

<div id='menu2' style="float: left; width: 650px;">


<div id='coin-slider' style="margin-top: 5%; margin-left: 20%; float: left;">

<a href="img01_url" target="_blank">

<img src='img/linux.png' >

<span>

Description for img01

</span>

</a>

<a href="img02_url" target="_blank">

<img src='img/windows.png' >

<span>

Description for img01

</span>

</a>

<a href="img03_url" target="_blank">

<img src='img/mac.png' >

<span>

Description for img01

</span>

</a>

<a href="img04_url" target="_blank">

<img src='img01.jpg' >

<span>

Description for img01

</span>

</a>

<a href="img05_url" target="_blank">

<img src='img01.jpg' >

<span>

Description for img01

</span>

</a>

</div>

</div>

<div id='menu3' style="float: left; margin-top: -330px; width: 650px; margin-left: 700px;">

<a style="float: left;"><img src="img/nav.png"></a>

<a style="float: left;"><img src="img/plugin.png"></a>

<a style="float: left;"><img src="img/cloud.png"></a>

<a style="float: left;"><img src="img/ldoc.png"></a>

<a style="float: left;"><img src="img/office.png"></a>

<a style="float: left;"><img src="img/tool.png"></a>

<a style="float: left;"><img src="img/emul.png"></a>

<a style="float: left;"><img src="img/virt.png"></a>

<a style="float: left;"><img src="img/seg.png"></a>

<a style="float: left;"><img src="img/plav.png"></a>

<a style="float: left;"><img src="img/conv.png"></a>

<a style="float: left;"><img src="img/3d.png"></a>

<a style="float: left;"><img src="img/compr.png"></a>

<a style="float: left;"><img src="img/otim.png"></a>

<a style="float: left;"><img src="img/comun.png"></a>

<a style="float: left;"><img src="img/email.png"></a>

<a style="float: left;"><img src="img/gdown.png"></a>

<a style="float: left;"><img src="img/torrent.png"></a>

<a style="float: left;"><img src="img/desenv.png"></a>

</div>


<div id='menu4' style="width: 1366px; height: 200px; margin-top: 0px; margin-left: 70px; float: left;">

<p style="font-size: 30px; height: 20px; font-family: Open Sans Light; margin-top: 5px;">Recomendados</p>

<div id='app1' style="width: 300px; height: 100px; margin-top: 40px; background-color: #c9c9c9; float: left; border: 0.5px solid #c3ff00;"></div>

<div id='app2' style="width: 300px; height: 100px; margin-top: 40px; background-color: #c9c9c9; float: left; margin-left: 7px; border: 0.5px solid #c3ff00;"></div>

<div id='app3' style="width: 300px; height: 100px; margin-top: 40px; background-color: #c9c9c9; float: left; margin-left: 7px; border: 0.5px solid #c3ff00;"></div>

<div id='app4' style="width: 300px; height: 100px; margin-top: 40px; background-color: #c9c9c9; float: left; margin-left: 7px; border: 0.5px solid #c3ff00;"></div>

</div>


<script type="text/javascript">

$(document).ready(function() {

$('#coin-slider').coinslider({ width: 500, height: 298, navigation: true, hoverPause: true, delay: 3000 });

});

</script>


</body>

</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Bom, primeiramente, eu aconselharia voce a nao usar o estilo em style, utilize um arquivo .css externo para aplicar o estilo. Outra coisa, no seu button, percebi que há códigos duplicados, por exemplo border:0; border:6px; no mesmo style. Isso pode estar gerando esse conflito. Migre todo seu estilo para um .css e depois faça essa limpeza de códigos e veja como fica =D

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.