Jump to content

Search the Community

Showing results for tags 'CSS'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Q&A Desenvolvimento
    • Perguntas e respostas rápidas
  • Desenvolvimento e Banco de Dados
    • HTML e CSS
    • Java
    • Javascript
    • .NET
    • PHP
    • Python
    • Ruby
    • Mobile
    • Ambientes de Desenvolvimento
    • Arquitetura e Métodos Ágeis
    • Banco de Dados
    • DevOps
    • Desenvolvimento de Games
    • E-Commerce e Pagamentos Online
    • SEO e Otimizações
    • WordPress
    • Algoritmos & Outras Tecnologias
  • Design e Produto
    • Fotografia
    • Photoshop
    • Design de interfaces e UX
    • Edição/Produção de Vídeos
    • Marketing Online
    • Desenho, Ilustração e 3D
  • Entretenimento e uso pessoal
    • Geral
    • Segurança & Malwares
    • Gadgets e wearable
    • Softwares e Apps
    • Entretenimento

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Google+


Hangouts


Skype


Twitter


deviantART


Github


Flickr


LinkedIn


Pinterest


Facebook


Site Pessoal


Localização


Interesses

Found 1342 results

  1. Usleydocarmo

    Não carrega as configurações do css

    Estou com o seguinte erro: Ao acessar o meu site na pagina principal tudo ok. Porém quando acesso em um menu que vai carregar um arquivo que está em uma pasta e não na pasta raiz, ai o arquivo css não é carregado. <a href="usuarios"> home</a> chamo o arquivo funcionarios na mesma pasta onde está o arquivo index.php -funciona <a href="usuarios/usuarios"> home</a> Pasta 'usuarios' e dentro dela chamo o arquivo 'usuarios' - ai não funciona Descobri que quando entro na pasta usuários fica assim, com a basta no diretório do arquivo. Como corrigir? <link rel="stylesheet" href="http://localhost/keiri/admin/usuarios/plugins/fontawesome-free/css/all.min.css&nbsp;"> Meu htaccess RewriteRule ^([a-z]+)\/?$ dashboard.php?arquivo=$1 [NC,L] RewriteRule ^([a-z]+)\/([a-z]+)$ dashboard.php?pasta=$1&arquivo=$2 [NC,L] RewriteRule ^([a-z]+)\/([a-z]+)\/([0-9]+)$ dashboard.php?pasta=$1&arquivo=$2&item=$3 [NC,L]
  2. lezão

    Div sobrepondo o slide

    Ola boa tarde! Td bem com vcs? Alguém poderia me dar uma luz, de como fazer essas imagens ficar a frente do slideshow e qnd responsivo aparecer de 3 em 3. obrigado pela atenção.
  3. Estou buscando uma orientação ou referência para desenvolver algo similar ao formulário dessa página do iPhone https://www.apple.com/shop/buy-iphone/iphone-se ... quando selecionamos alguma opção, a div que contém o formulário centralizar na página e rola feito um carrossel. Estou completamente perdido com essa demanda que recebi... agradeço antecipadamente a todos que derem uma força. Abraço
  4. joelsonoliveirasouza

    Pagina "MEUS PEDIDOS" em um sistema de loja virtual

    Boa noite pessoal, estou com um problema no momento de buscar os itens dos pedidos, estou utilizando o carregamento de templates Smarty onde no arquivo TPL tenho uma pagina chamada clientes_pedidos.tpl onde contem {foreach from=$PEDIDOS item=P} buscando os dados do pedido e dentro desse foreach preciso ter outro foreach para que possa buscar os itens do pedido para apresentar na pagina clientes_pedidos.tpl, vou anexar algumas imagens. quando insiro foreach dentro do outro ele mostra somente o primeiro dados buscado do banco (ele mostra o mesmo dado em todos os pedidos). Desde já agradeço pela atenção de todos. Arquivo: clientes_pedidos.tpl <div class="main-panel" > <div class="content"> {foreach from=$PEDIDOS item=P} <div class="container-fluid" style="background: white;"> <section class="invoice"> <!-- title row --> <div class="row"> <div class="col-xs-12"> <h2 class="page-header"> <i class="fa fa-globe"></i><i> {if $P.ped_pag_status == 'NAO'} <td style="width: 15%"><span class="label label-danger">{$P.ped_pag_status}</span></td> {elseif $P.ped_pag_status == 'Pago'} <td style="width: 15%"><span class="label label-success">{$P.ped_pag_status}</span></td> {elseif $P.ped_pag_status == ''} <td style="width: 15%"><span class="label label-danger">Erro no pagamento</span></td> {else} <td style="width: 15%"><span class="label label-info">{$P.ped_pag_status}</span></td> {/if} </i> <small class="pull-right">Data: {$P.ped_data}</small> </h2> </div><!-- /.col --> </div> <!-- info row --> <div class="row invoice-info"> <div class="col-sm-4 invoice-col"> <b>Informações</b><br/> <br/> <b>Codigo Pedido:</b> {$P.ped_id}<br/> <b>Forma Pagamento:</b> {$P.ped_pag_forma}<br/> <b>Nota Fiscal: </b> <a>Baixar</a> </div> <div class="col-sm-4 invoice-col"> <b>Dados Entrega</b><br/> <br/> Rua Hebreus, 849, Canaã<br> Ipatinga-Mg, 35.164-170<br> </div><!-- /.col --> <div class="col-sm-4 invoice-col"> <b>Dados Contato</b><br/> <br/> Contato: (31) 9 9964-2340<br/> Email: essence@hotmail.com.br<br> </div><!-- /.col --> </div><!-- /.row --> <br> <!-- Table row --> <div class="row"> <div class="col-xs-12 table-responsive"> <table class="table table-striped"> <thead> <tr> <th>IMAGEM</th> <th>ITEM</th> <th>QUANTIDADE</th> <th>VALOR</th> <th>DETALHES</th> </tr> </thead> <tbody> {foreach from=$ITENSPEDIDO item=I} <tr> <td>{$I.1.ped_cod}</td> <td>Call of Duty</td> <td>3</td> <td>R$ 64,50</td> <form name="itens" method="post" action="{$PAG_ITENS}"> <input type="hidden" name="cod_pedido" id="cod_pedido" value="{$P.ped_cod}"> <td><button>Detalhes</button></td> </form> </tr> {/foreach} </tbody> </table> </div><!-- /.col --> </div><!-- /.row --> <div class="row"> <!-- accepted payments column --> <div class="col-xs-6"> <br> <p class="lead">Informações Adicionais</p> <p class="text-muted well well-sm no-shadow" style="margin-top: 10px;"> Todos os produtos essence são devidamentes embalados, adotando todas as medidas de segurança que seu produto chegue com 100% de sua integridade. </p> </div><!-- /.col --> <div class="col-xs-6"> <br> <p class="lead">Data do Pedido 20/06/2020</p> <div class="table-responsive"> <table class="table"> <tr> <th style="width:50%">Subtotal:</th> <td>R$250,30</td> </tr> <tr> <th>Frete</th> <td>R$10,34</td> </tr> <tr> <th>Desconto</th> <td>R$3,00</td> </tr> <tr> <th>Total:</th> <td>R$363,64</td> </tr> </table> </div> </div><!-- /.col --> </div><!-- /.row --> <!-- this row will not appear when printing --> <div class="row no-print"> <div class="col-xs-12"> <a href="invoice-print.html" target="_blank" class="btn btn-default"><i class="fa fa-print"></i> TROCA OU DEVOLUÇÃO</a> <button class="btn btn-success pull-right"><i class="fa fa-credit-card"></i> CONFIRMAR RECEBIMENTO</button> <button class="btn btn-primary pull-right" style="margin-right: 5px;"><i class="fa fa-download"></i> AJUDA</button> </div> </div> </section> </div> <div style="width: 100%; height: 20px; background: transparent;"></div> {/foreach} </div> </div> </div> Arquivo: clientes_pedidos.php <?php $smarty = new Template(); Login::MenuCliente(); $pedidos = new Pedidos(); $pedidos->GetPedidosCliente($_SESSION['CLI']['cli_id']); $smarty->assign('PEDIDOS', $pedidos->GetItens()); $smarty->assign('PAG_ITENS', Rotas::pag_ClienteItens()); $arrayNumeroPedido = $pedidos->GetItens(); foreach ($arrayNumeroPedido as $key) { $itens = new Itens(); $pedido = filter_var($key['ped_cod'], FILTER_SANITIZE_STRING); $itens->GetItensPedido($pedido); $array = array($itens->GetItens()); $smarty->assign('ITENSPEDIDO', $array); $smarty->assign('TOTAL', $itens->GetTotal()); } $smarty->display('clientes_pedidos.tpl'); ?>
  5. Bons dias, fórum! Procurei uma área específica para o JavaFX e não encontrei... Estou aprendendo a usar essa biblioteca, está ficando interessante, se assemelha às tecnologias web com as quais tenho muita familiaridade pois uso há anos. Mas o CSS do JavaFX é diferente daquele do consórcio W3, e não estou encontrando material para entender esse -fx-CSS... A referência CSS da Oracle (https://docs.oracle.com/javase/8/javafx/api/javafx/scene/doc-files/cssref.html) é obscura e não contém as infos que preciso, apesar de esclarecer muitas coisas... Passa uma impressão de que eles não querem que todos saibam! Por exemplo: ao estilizar uma menu-bar, mudei seu background, alterei a cor da fonte dos menus, mas eles ficaram colados uns nos outros, e eu não entendi como escolher a propriedade CSS adequada do FX para controlar a distância dos menus. Pude usar um padding, mas ao executar, quando abrimos um menu, os outros ainda são empurrados pois ainda que suas inscrições estejam separadas, os botões do menu ainda estão colados. O tutoriais não abordam o CSS do FX em profundidade, focam-se nos objetivos dos projetos e suas abordagens... Rsrs, podia ter no W3Schools... Alguém pode me ajudar com isso??? Grato desde já! Lucas Ribeiro
  6. Sapinn

    Erro ao tentar chamar arquivo CSS

    Estou com dificuldade para chamar um arquivo CSS usando a configuração de um arquivo php. O bootstrap também não surte efeito na paginas Vejam só Config.php <?php define('APP_NOME','Projeto GIBI'); define('URL','http://localhost/bora_php'); index.php <?php include './../app/configuracao.php'; include './../app/Libraries/Rota.php'; include './../app/Libraries/Controller.php'; ?> <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="<?=URL?>/public/css/estilos.css"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" > <title><?= APP_NOME?></title> </head> <body> <?php $rotas = new Rota(); ?> <script src="https://code.jquery.com/jquery-3.5.1.min.js" ></script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" ></script> <script src="<?=URL?>/public/css/script.js" ></script> </body> </html> estilo.css html{ background-color: red; } Estou tentando seguir a padronização MVC(que por sinal eu tenho certa dificuldade), então não consigo achar onde estou errando
  7. Marlonsantos

    Dúvida com link e div's

    Olá pessoal, eu estou começando meu curso de programação Full Stack e tive a tarefa de fazer uma página mais parecida possível com essa. Mas estou com muita dificuldade na hora de colocar essa <DIV> branca dentro dessa <DiV> preta. Eu já consegui colocar os links nas imagens do Facebook e do Instagram, porém não consigo alinhar elas no canto direito, meu <h1> vem junto... Muito obrigado pela atenção galera
  8. Tudo bem pessoal! Estou há alguns dias pesquisando e usando diferentes dicas para resolver o problema para que a borda inferior de 1px aplicada em quatro boxes sejam exibidas igualmente no chrome, safari, mozilla, opera e IE. A estrutura é a seguinte: ==========CSS html, body, span, p, form, img, a, ul, ol, li, table, tr, td, div { margin: 0px; padding: 0px; border:none; outline:none; list-style-type:none; box-sizing: border-box; } * { font-size: 14px; font-family: verdana, arial; } .container { width: 608px; height: 421px; margin: auto; margin-top: 50px; overflow: hidden; } .box_one, .box_two { display: inline-block; width: 300px; height: 250px; overflow: hidden; } .border_bottom { border-bottom: #f5f5f5 solid 1px; } .border_bottom_white { border-bottom: #fff solid 1px; } .espaco { margin-right: 2px; } .box_tree, .box_four, .box_fift { display: inline-block; width: 198px; height: 149px; margin-top: 20px; overflow: hidden; } .vertical { vertical-align: top; } ============HTML <content> <div class="container"> <div class="box_one border_bottom_white espaco vertical">box one in first line</div> <div class="box_two border_bottom vertical">box two in first line</div> <div class="box_tree espaco border_bottom vertical">box tree in second line</div> <div class="box_four espaco border_bottom vertical">box four in second line</div> <div class="box_fift border_bottom vertical">box fift in second line</div> </div> </content> O que ocorre é que cada navegador exibe de uma maneira diferente, mesmo resetando o box-sizing: border-box; o font-size e o font-family. Essa configuração do CSS foi a mais próxima do desejável. A estrutura do HTML precisa ser essa aí. Agradeço desde já.
  9. Camilavip

    Flip de rotação invade o rodapé

    Oi, tenho um flip para virar a imagem, bem pequeno e funcional, mas ao colocar um rodapé, ele simplesmente invade esse rodapé Creio que tem haver alguma coisa com o position: absolute, mas não entendo nada de css <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"> </head> <body> <!-- CSS DO FLIP --> <style> .flip-container:hover .flipper{ transform: rotateY(180deg); /* se quiser uma animação na vertical, troque por rotateX(180deg) */ } .flipper{ width: 100%; height: 100%; transition: transform 0.8s; transform-style: preserve-3d; } .front, .back{ position: absolute; width: 100%; height: 100%; } .back{ transform: rotateY(180deg); } </style> <center> <div class="flip-container"> <div class="flipper"> <div class="front"> <img src="https://d3mwk3f7r8fv9u.cloudfront.net/images/zohO24tyN2WB8etR3nhZPvhf.png" /> </div> <div class="back"> <img src="https://d3mwk3f7r8fv9u.cloudfront.net/images/XkAkTVqVPbLB3cK5njqdun66.png" /> </div> </div> </div> <!-- AQUI COMEÇA O RODAPÉ --> <!-- CSS DO RODAPÉ --> <style> @import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap'); *{ margin: 0; padding: 0; color: #d9d9d9; box-sizing: border-box; font-family: 'Poppins', sans-serif; } .content1{ position: relative; margin: 130px auto; text-align: center; padding: 0 20px; } .content1 .text{ font-size: 2.5rem; font-weight: 600; color: #202020; } .content1 .p{ font-size: 2.1875rem; font-weight: 600; color: #202020; } footer{ position: fixed; bottom: 0px; width: 100%; background: #111; } .main-content{ display: flex; } .main-content .box{ flex-basis: 50%; padding: 10px 20px; } .box h2{ font-size: 1.125rem; font-weight: 600; text-transform: uppercase; } .box .content{ margin: 20px 0 0 0; position: relative; } .box .content:before{ position: absolute; content: ''; top: -10px; height: 2px; width: 100%; background: #1a1a1a; } .box .content:after{ position: absolute; content: ''; height: 2px; width: 15%; background: #f12020; top: -10px; } .left .content p{ text-align: justify; } .left .content .social{ margin: 20px 0 0 0; } .left .content .social a{ padding: 0 2px; } .left .content .social a span{ height: 40px; width: 40px; background: #1a1a1a; line-height: 40px; text-align: center; font-size: 18px; border-radius: 5px; transition: 0.3s; } .left .content .social a span:hover{ background: #f12020; } .center .content .fas{ font-size: 1.4375rem; background: #1a1a1a; height: 45px; width: 45px; line-height: 45px; text-align: center; border-radius: 50%; transition: 0.3s; cursor: pointer; } .center .content .fas:hover{ background: #f12020; } .center .content .text{ font-size: 1.0625rem; font-weight: 500; padding-left: 10px; } .center .content .phone{ margin: 15px 0; } .right form .text{ font-size: 1.0625rem; margin-bottom: 2px; color: #656565; } .right form .msg{ margin-top: 10px; } .right form input, .right form .msgForm{ width: 100%; font-size: 1.0625rem; background: #151515; padding-left: 10px; border: 1px solid #222222; } .right form input:focus, .right form .msgForm:focus{ outline-color: #3498db; } .right form input{ height: 35px; } .right form .btn{ margin-top: 10px; } .right form .btn button{ height: 40px; width: 100%; border: none; outline: none; background: #f12020; font-size: 1.0625rem; font-weight: 500; cursor: pointer; transition: .3s; } .right form .btn button:hover{ background: #000; } .bottom center{ padding: 5px; font-size: 0.9375rem; background: #151515; } .bottom center span{ color: #656565; } .bottom center a{ color: #f12020; text-decoration: none; } .bottom center a:hover{ text-decoration: underline; } @media screen and (max-width: 900px) { footer{ position: relative; bottom: 0px; } .main-content{ flex-wrap: wrap; flex-direction: column; } .main-content .box{ margin: 5px 0; } } </style> <div class="content1"> <div class="text"> Fully Responsive Footer Section</div> <div class="p"> HTML and CSS (Flexbox)</div> </div> <footer> <div class="main-content"> <div class="left box"> <h2> About us</h2> <div class="content"> <p> CodinNepal is a YouTube channel where you can learn web designing, web development, ui/ux designing, html css tutorial, hover animation and effects, javascript and jquery tutorial and related so on.</p> <div class="social"> <a href="https://facebook.com/coding.np"><span class="fab fa-facebook-f"></span></a> <a href="#"><span class="fab fa-twitter"></span></a> <a href="https://instagram.com/coding.np"><span class="fab fa-instagram"></span></a> <a href="https://youtube.com/c/codingnepal"><span class="fab fa-youtube"></span></a> </div> </div> </div> <div class="center box"> <h2> Address</h2> <div class="content"> <div class="place"> <span class="fas fa-map-marker-alt"></span> <span class="text">Birendranagar, Surkhet</span> </div> <div class="phone"> <span class="fas fa-phone-alt"></span> <span class="text">+089-765432100</span> </div> <div class="email"> <span class="fas fa-envelope"></span> <span class="text">abc@example.com</span> </div> </div> </div> <div class="right box"> <h2> Contact us</h2> <div class="content"> <form action="#"> <div class="email"> <div class="text"> Email *</div> <input type="email" required> </div> <div class="msg"> <div class="text"> Message *</div> <!-- NOTE: Due to more textarea tag I got an error. So I changed the textarea name to changeit. Please change that changeit name to textarea --> <changeit id=".msgForm" rows="2" cols="25" required></changeit> <!-- replace this changeit name to textarea --> <br /> <div class="btn"> <button type="submit">Send</button> </div> <div class="bottom"> <center> <span class="credit">Created By <a href="https://youtube.com/c/codingnepal">CodingNepal</a> | </span> <span class="far fa-copyright"></span> 2020 All rights reserved. </center> </div> </body> </html>
  10. thailangodoy

    Borda externa - Efeito hover

    Boa tarde amigos, Quero copiar o efeito hover, que aparece na foto de perfil do login, o qual consiste em uma borda externa, que não influencia no tamanho. Tentei atribuiu o box-sizing:border-box; // ele diminui a imagem e traz a borda para dentro.
  11. Kemily

    Publicação de HTML

    Eu preciso de ajuda para poder publicar meu site. O professor mandou faze-lo em HTML e CSS e eu fiz mas eu não sei postar e manter as imagens. Quando consegui postar as imagens não foram junto. O link q consegui fazer sem as imagens ficou assim: http://hyundai.droppages.com/
  12. danicarla

    Versão para impressão

    Olá pessoas, Estou tentando fazer uma versão de impressão usando CSS eu queria colocar um cabeçalho e um rodapé em todas as paginas, O problema é que o conteúdo vem do banco de dados, e dependendo do tamanho dos parágrafos em algumas vezes o texto acaba ficando em cima do cabeçalho ou do rodapé.. alguém tem alguma idéia de como posso fazer isso? Meu cód está assim: header {font-family:Arial;font-size: 22px;color: #000;text-align: center;} footer {font-family:Arial;font-size: 10px; color: #CD090C;text-align: center;} article {font-family:Arial;font-size: 14px; color: #000;text-align: justify;} @page {size: A4;margin: 11mm 17mm 17mm 17mm;} @media print { header {position: fixed;top: 0;} footer {position: fixed;bottom: 0;} article {position: relative;top:40px;} .content-block, p {top:40px;page-break-inside: avoid;} html, body {width: 210mm;height: 297mm;} } E no HTML <header>CABEÇALHO</header> <article>Conteudo.. texto.. etc..</article> <footer>Texto do Rodapé</footer>
  13. templateonweb

    Bootstrap Website Template

    Hi, Many of you want Bootstrap website templates. In this way, you have to develop a wonderful website. As this is the cheapest and fastest way to reach over the world. If you are interested in making a website by using Bootstrap website templates, then here I am sharing a website link that provides free website designs as Bootstrap website templates. If you are interested in then you can visit the site and use the best quality of Bootstrap website templates. Please visit: Bootstrap Website Templates
  14. Pessoal, alguem sabe como eu posso transformar esse relatório em html? comecei a implementar o código de html, mas não está igual rs. Esse é meu html, que não consegui fazer ficar igual da imagem em anexo, se alguém puder me ajudar agradeço. <style> table { border-collapse: collapse; margin-left: 0; } div.conteudodatabela { overflow: visible; } table > tbody { overflow: visible; } /*adds control for test purposes*/ thead td { font-size: 11pt; } tfoot td { text-align: center; font-size: 9pt; } thead { display: table-header-group; margin-bottom: 10px } tfoot { display: table-footer-group; } thead th, thead td { position: static; } thead tr { position: static; } /*prevent problem if print after scrolling table*/ table tfoot tr { position: static; } /* table */ .checkbox { width: 20px; height: 20px; border: 1px solid black; text-align: center; float: left; margin-right: 10px; font-size: 150%; } .foo { writing-mode: vertical-lr; } .border { border: 1px solid black; } table{ font-weight: 800; font-size: 80%; width: 100%; margin: 10px; margin-bottom: 20px; } .bg{ background: rgb(230,230,230); } .h1{ font-size: 120%; } .center{ text-align: center; } .semi-full-width{ width: 80%; } .row{ margin: 50px; } .p-1{ margin: 30px; margin-bottom: 40px; margin-top: 40px; padding: 8px; } .textovertical{ writing-mode: horizontal-tb; width:11px; word-wrap: break-word; font-family: Arial, Helvetica, sans-serif; white-space: pre-wrap; } tr{ margin: 10px; margin-bottom: 50px; } .m-r{ margin-right: 830px; } .padding_master { padding: 30px; } .conteiner{ font-size: 90%; } .table td{ border: 1px solid black; padding: 1px; margin: 0px; } .lineBottom-inLine{ /* <p> */ border-bottom: 1px solid black; display: inline; } .lineBottom{ /* <p> */ border-bottom: 1px solid black; } .no-border{ border: 0px; } .no-space{ margin: 1px; padding: 1px; } .no-bold{ font-weight: 500; } .space-p p{ margin: 1px; padding: 1px; } .tr-center td{ text-align: center; } .regras p{ margin: 0px; } </style> <style type="text/css" media="print"> @page { size: auto; margin: 0mm; } </style> <div class="table" runat="server" style="margin: 1 auto;"> <div> <table style="padding: 0px; margin: 0px;" class="no-bold"> <tr class="center"> <td class="textovertical">Contratação</td> <td colspan="2">Origem Dívida</td> <td>Credor</td> <td colspan="2">Devedor</td> <td>Credor</td> </tr> <tr class="tr-center"> <td class="textovertical" id="border" rowspan="4" style="width:43px">Direta</td> <td class="textovertical" id="border" colspan="" rowspan="1">Interna</td> <td id="border" colspan="2" rowspan="">teste25</td> <td id="border" colspan="2" rowspan="">teste12</td> <td>teste 1</td> </tr> <tr class="tr-center"> <td id="border" rowspan="1">Externa</td> <td id="border" colspan="2" rowspan="3"> teste20</td> <td id="border" colspan="2" rowspan="">teste40</td> <td>teste 1</td> </tr> </table> </div> <br/> <br/> </div> Essa é a imagem do link de como deveria ficar a estrutura do relatório. https://drive.google.com/file/d/1cgxh2IKu6KcVEMmLEEgorYqBtjpgHNgs/view?usp=sharing
  15. Eu gostaria de saber como eu faço para que uma DIV fique somente no limite do conteúdo, sem que ela herde a largura da DIV "pai". Exemplo no JSFiddle Eu quero que a DIV (.inside-box) fique com a largura limitada somente ao texto de "Fazer Download", sem que ela herde a largura da DIV (.box). Agradeço !! Resolvido >> stackoverflow
  16. Rebeca Julia Bronzatti

    Mudança do layout em select e buttons

    Boa tarde, bom ontem no meu projeto tudo estava funcionando normalmente, hoje assim que iniciei notei que os selects alguns buttons estavam divergindo do formato que eu gostaria, eu não faço ideia do porque isso, já que ele não apresenta erro e nada no código foi alterado pelo menos não nesses campos, já tentei fazer novamente mas a configuração continua, tentei alterar pelo CSS mas infelizmente ele simplesmente ignora, assim que iniciei hoje o projeto me deparei com esse erro Failed to load resource: the server responded with a status of 404 (Not Found) mas consegui resolver não sei se tem algo haver, se alguém puder me dar um help eu agradeceria muito nunca vi isso na vida. Eu to usando o materialize esse select já vem pronto. <div class="col s3"> <select name='tipo' class="browser-default"> <option value="" disabled selected>Tipo</option> <option value="Casa" class="tipo">Casa</option> <option value='Apartamento' class="tipo">Apartamento</option> <option>Sobrado</option> <option>Edicula</option> <option>KitNet</option> <option>Flat</option> <option>Sala Comercial</option> <option>Loja</option> <option>Galpão</option> <option>Terreno</option> <option>Fazenda</option> </select> </div>
  17. Salveee! Certo a dúvida que trarei aqui agora é bem complexa e eu sinceramente não sei se é realmente possível mas acho que não custa nada perguntar. Fiz um site de envio de textos, onde o aluno envia um texto e o professor corrigi até ai blz, queria saber como eu poderia fazer pra quando o professor marcar uma palavra aprece-se uma caixa de dialogo onde ele colocaria, por exemplo, a correção da palavra ou alguma explicação e essas informações seriam enviadas para o banco de dados quando o aluno acessa a correção desse texto e o ele passa-se mouse por cima dessa palavra apareceria a correção em um balãozinho. Como exemplo desse comportamento que acabei de citar temos o google documents que faz algo desse jeito. Queria saber se isso pode ser possível sem exigir muito código ou muita coisa. Desde já agradeço.
  18. Eu tenho 2 arquivos CSS externos que contém backgrounds da página. Em 1 só tem links para imagens .webP e em outro somente .PNG , eu estou usando um script para detectar se o browser aceita .webP e caso afirmativo ele altera o link CSS externo em HEAD para o css externo com .webP, por padrão inicialmente ele aponta para o .png, testei numa página mais simples e deu ok, mas na hora de colocar aonde quero não funcionou, segue o código: No HEAD: <link href="‪arquivos_css/png.css" rel="stylesheet" id="key"> No JS: ////////////////////////////////////////////////////////////// // FUNÇÃO QUE CRIA O LINK EXTERNO CSS PARA INSERIR NO HEAD // OK// ////////////////////////////////////////////////////////////// function loadCSS(url){ var link = document.createElement('link'); link.setAttribute('href', url ); link.setAttribute('rel', "stylesheet" ); link.setAttribute('id', "key" ); var para = document.getElementsByTagName('head')[0]; //Nó pai HEAD var velho = document.getElementById('key'); //local exato do elemento a ser substituido para.replaceChild(link, velho); //Substituímos o velho pelo novo(link) } ////////////////////////////// Chamada à função do webP ///////////////////////////// WebpIsSupported(function(isSupported){ if(isSupported){ //CHAMA A FUNÇÃO LOADCSS e carrega o link CSS externo com WEBP loadCSS('arquivos_css/webp.css'); } }); ////////////////////////////////////////////////////////////// // FUNÇÃO QUE DETECTA A COMPATIBILIDADE DO BROWSER COM WEBP // ////////////////////////////////////////////////////////////// function WebpIsSupported(callback){ if(!window.createImageBitmap){ callback(false); return; } var webpdata = 'data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoCAAEAAQAcJaQAA3AA/v3AgAA='; fetch(webpdata).then(function(response){ return response.blob(); }).then(function(blob){ createImageBitmap(blob).then(function(){ callback(true); }, function(){ callback(false); }); }); } O erro que está dando no chrome é esse: Failed to load resource: net::ERR_FILE_NOT_FOUND já mudei na função loadCSS o endreço dos arquivos de loadCSS('arquivos_css/webp.css'); para loadCSS('/arquivos_css/webp.css'); e não funciona.... o arquivo CSS externo contém backgrounds dentro do seletor HTML tipo : html { background-image.....(1); background-image.....(2); background-image.....(3); etc } eu vou no elements do chome e está lá no HEAD conforme quero mas não carrega na página e dá este erro no console. – o que pode estar acontecendo ? ?
  19. Olá, eu estou estudando CSS e estou com um problema que já pesquisei e não consegui entender direito, a dúvida é: como remover um item (nesse caso, uma imagem por exemplo) quando a pessoa estiver, por exemplo, usando um celular para ver o site? Ou seja, quem acessar pelo pc, conseguirá ver a imagem, quem acessar pelo celular, não verá
  20. Boa noite! Preciso de ajuda... Estou fazendo o código de responsividade, o código para telas grandes eu já fiz, agora estou trabalhando no programação do código para telas pequenas. Eu tenho uma lista que possui imagens nas <li>, porém quando for resolução menor (480px) eu quero que as imagens mudem para outras. Exemplificando: Código para resolução minima de 760px: <section id="body-whats"> <ul> <li><a href="link" target="_blank"><img src="imagem 1"></a> <li><a href="link" target="_blank"><img src="imagem 2"></a> <li><a href="link" target="_blank"><img src="imagem 3"></a> </ul> </section> Código para resolução minima de 480px: Para resolução menor eu quero trocar as imagens: imagem 1 imagem 2 imagem 3 por imagem x imagem y imagem z Como poderia fazer isso usando apenas html e CSS? OBS: Nas DIVs que eu tenho imagens, eu consegui fazer a mudança de imagem com o seguinte atributo: <picture> <source media="(max-width:480px)" srcset="../image/bg-phone.png"> <source media="(max-width:780px)" srcset="../image/bg-tablet.png"> <source media="(min-width:800px)" srcset="../image/bg-topo3.jpg"> <img src="../image/bg-topo3.jpg" width=100%> </picture>
  21. Vaga: Web designer - WordPress Estamos com vaga aberta para Web Designer com experiência em WordPress para atuar na área de Marketing. Principais atividades: Desenvolvimento e manutenção de websites em ambiente WordPress. Criação de artes gráficas para o uso no ambiente web, que atendam sites, redes sociais e anúncios para campanhas de marketing. Requisitos: Grande experiência em Wordpress com desenvolvimento de layouts responsivos e também com instalação de plugins/componentes. Conhecimento dos formatos e tamanhos de imagens para site, rede sociais, e para anúncios de campanhas de marketing. Conhecimentos de HTML | CSS | SEO. Excelentes habilidades no PACOTE ADOBE (Illustrator e Photoshop). Detalhes: VAGA CLT - Período Integral - Home Office Estamos localizados em condomínio empresarial próximo à Unicamp. Detalhes da empresa e local, clique aqui. Interessados, por favor preencher o formulário ao lado até 31/Maio/2020. Interessados deverão enviar o portfólio e realizar o cadastro nesse link: https://go.vulcanet.com.br/vaga-web-designer
  22. Olá, tenho um form que pede um codigo enviado por email para o usuário confirmar, essa mesma pagina já está gerada o código dentro de uma variável. O que eu preciso é que no momento que o usuário digitar o codigo nesse input text que é composto de 6 digitos, o botão submit habilite (mas somente se o que foi digitado corresponder a variavel). Segue abaixo o meu Form. <input type="text" class="textenv" maxlength="6" placeholder="Digite o código enviado:"></input> <button type="submit" class="btncria" >Confimar<font color="#fff"></font></button> Alguem sabe como utilizar js nesse caso? Muito obrigado!!
  23. Olá, estou com uma dificuldade para posicionar um elemento. Se trata de um pop-up que aparece na tela ao clicar. Acontece que esse pop-up não fica centralizado em todas as telas dependendo da resolução. No momento estou usando o position absolute, a div é essa abaixo: .form-structor { background-color: #222; border-radius: 15px; height: 550px; width: 450px; position: absolute; top: -100px; left: 170px; overflow: hidden; } Também já tentei: {position: relative; top: 50%; left: 50%;} Alguém pode me ajudar? Qual propriedade eu utilizo para ficar centralizado tanto horizontal e quanto vertical em qualquer resolução?
  24. FabianoSouza

    CSS responsivo - agrupar boxes

    Pessoal, estou refazendo meu site com base num "modelo" que encontrei por aí. Estou enfrentando dificuldade para montar o layout dentro da tag header . Coloquei duas imagens para ilustrar o resultado que preciso atingir em desktop (os 4 itens exibidos em 2 pares) e em mobile (os 4 itens exibidos em coluna). Provisoriamente estou colocando o site nesse link, link para testes onde é possível ver tudo (HTML, CSS, JS e etc). O arquivo que tem as regras CSS da página é o css.css. Peço ajuda ao colegas para conseguir ajustar essa parte central do layout :-) (não se apeguem às cores fortes do que estou usando dentro da HEADER ...são apenas para testes)
  25. Boa noite amigos, tudo bem? Estou montando um site com materialize, inseri um carousel-slider porem ele nao da autoplay, alguem sabe me dizer qual o problema? segue meu codigo para detalhar <!DOCTYPE html> <html lang="pt-BR"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0" /> <title>Lab Ingressos - Sua Melhor Experiência em Entretenimento</title> <!-- CSS --> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" /> <link href="css/style.css" type="text/css" rel="stylesheet" media="screen,projection" /> <script src="https://unpkg.com/ionicons@5.0.0/dist/ionicons.js"></script> </head> <body class="grey lighten-4"> <?php include_once 'inc/menu_nav.php';?> <div class="tabs-content carousel carousel-slider"> <a class="carousel-item" href="#one!"><img src="img/img1.jpg"></a> <a class="carousel-item" href="#two!"><img src="img/logo_LAB_full.png"></a> <a class="carousel-item" href="#three!"><img src="img/img2.jpg"></a> </div> (function ($) { $(function () { $(".sidenav").sidenav(); $('.carousel.carousel-slider').carousel({ fullWidth: true, duration: 200, }); $(".collapsible").collapsible(); $("#textarea1").val(""); M.textareaAutoResize($("#textarea1")); $(document).ready(function () { $("select").formSelect(); }); }); // end of document ready\ })(jQuery); // end of jQuery name space
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.