-
Posts
71 -
Cadastrado em
-
Última visita
Tipo de conteúdo
Artigos
Selos
Fabricantes
Livros
Cursos
Análises
Fórum
posts postados por Mizrain Phelipe Sá
-
-
Pessoal estou com um problema em minhas function pois criei duas para fazer o conteúdo oculto aparecer quando selecionado pelo option do select, porém o erro é que quando seleciona um o outro some e quando seleciona o outro ele vai pra debaixo da input errada, resumindo e como se as function estivessem ligadas, porém eu quero que elas sejam independentes, alguém me ajuda por favor?
Esse é o código HTML dos elementos:
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> <div class="form-group pmd-textfield pmd-textfield-floating-label"> <label>1.1.9 Orientação sexual da Vítima</label> <select class="select-simple form-control pmd-select2 empty" onclick="selected(this.value)" id="119" name="119"> <option selected>Selecionar</option> <option>NCI - Não Consta Informação</option> <option>Heterossexual</option> <option>Homossexual</option> <option>Bissexual</option> <option>Não se aplica (criança menor de 06 anos de idade)</option> <option>Outro</option> </select> </div> <!-- Esta Janela aparecerá se a opção "Outro" for MARCADA (JAVASCRIPT)--> <div class="form-group pmd-textfield input119" style="display:none;"> <input type="text" id="regular1" class="form-control" placeholder="Qual? Especifique."> </div> </div> <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> <div class="form-group pmd-textfield pmd-textfield-floating-label"> <label>1.1.10 Identidade de gênero da vítima</label> <select class="select-simple form-control pmd-select2 empty" onclick="selected(this.value)" id="1110" name="1110"> <option selected>Selecionar</option> <option>NCI - Não Consta Informação</option> <option>Andrógeno</option> <option>Cisgênero</option> <option>Transformista</option> <option>Travesti</option> <option>Transexual</option> <option>Não se aplica (criança menor de 06 anos de idade)</option> <option>Outro</option> </select> </div> <!-- Esta Janela aparecerá se a opção "Outro" for MARCADA (JAVASCRIPT)--> <div class="form-group pmd-textfield input1110" style="display:none;"> <input type="text" id="regular1" class="form-control" placeholder="Qual? Especifique."> </div> </div>
E esse e o JavaScript com as duas Function que eu criei pra eles:
// CÓDIGO PARA OCULTAR/MOSTRAR elementos pelo SELECT function selected(value) { var input1110 = document.getElementsByClassName('input1110'); if (value != "Outro") { input1110[0].style.display = 'none'; } else { input1110[0].style.display = 'block'; } } function selected(value) { var input119 = document.getElementsByClassName('input119'); if (value != "Outro") { input119[0].style.display = 'none'; } else { input119[0].style.display = 'block'; } }
Alguém consegue me dizer onde esta o erro e porque as funções estão se interligando?
desde já agradeço!
-
-
Pessoal me ajudem por favor!
Gostaria de saber a quem usa ou já usou os componentes do Propeller que me explicassem a como devo utilizar o sidebar para fazer com que os links abram os conteúdos na mesma página pela tag <a>
Código HTML:
<nav class="navbar navbar-inverse pmd-navbar navbar-fixed-top pmd-z-depth" style="position:absolute;"> <div class="container-fluid"> <!-- Sidebar Toggle Button--> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <a href="javascript:void(0);" data-target="basicSidebar" data-placement="left" data-position="slidepush" is-open="true" is-open-width="1000" class="btn btn-sm pmd-btn-fab pmd-btn-flat pmd-ripple-effect pull-left margin-r8 pmd-sidebar-toggle"><i class="material-icons md-light">menu</i></a> <a class="navbar-brand" href="javascript:void(0);">Brand</a> </div> <!-- Navbar Right icon --> <div class="pmd-navbar-right-icon pull-right"> <a href="javascript:void(0);" class="btn btn-sm pmd-btn-fab pmd-btn-flat pmd-ripple-effect"><i class="material-icons pmd-sm md-light">search</i></a> <a href="javascript:void(0);" class="btn btn-sm pmd-btn-fab pmd-btn-flat pmd-ripple-effect topbar-toggle visible-xs-inline-block" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"><i class="material-icons pmd-sm">more_vert</i></a> </div> <!-- /.navbar-collapse --> </div> <!-- /.container-fluid --> </nav> <section id="pmd-main"> <!-- Left sidebar --> <aside id="basicSidebar" class="pmd-sidebar sidebar-default pmd-z-depth" role="navigation"> <ul class="nav pmd-sidebar-nav"> <!-- My Account --> <li class="dropdown pmd-dropdown pmd-user-info"> <a aria-expanded="false" data-sidebar="true" data-toggle="dropdown" class="btn-user dropdown-toggle media" href="javascript:void(0);"> <div class="media-left"> <img width="40" height="40" alt="avatar" src="http://propeller.in/assets/images/avatar-icon-40x40.png"> </div> <div class="media-body media-middle">D,Material Admin</div> <div class="media-right media-middle"><i class="material-icons pmd-sm">more_vert</i></div> </a> <ul class="dropdown-menu"> <li> <a class="pmd-ripple-effect" href="javascript:void(0);" tabindex="-1"><i class="material-icons media-left media-middle">person</i> <span class="media-body">View Profile</span></a></li> <li> <a class="pmd-ripple-effect" href="javascript:void(0);" tabindex="-1"><i class="material-icons media-left media-middle">settings</i> <span class="media-body">Settings</span></a></li> <li> <a class="pmd-ripple-effect" href="javascript:void(0);" tabindex="-1"><i class="material-icons media-left media-middle">history</i> <span class="media-body">Logout</span></a></li> </ul> </li> <li> <a class="pmd-ripple-effect" href="javascript:void(0);"><i class="material-icons media-left media-middle">delete</i> <span class="media-body">Trash</span></a> </li> <li> <a class="pmd-ripple-effect" href="javascript:void(0);"><i class="material-icons media-left media-middle">notifications</i> <span class="media-body">Spam</span></a> </li> <li> <a class="pmd-ripple-effect" href="javascript:void(0);"><i class="material-icons media-left media-middle">notifications</i> <span class="media-body">Follow Up</span></a> </li> </ul> </aside> <!-- Start Content --> <div class="pmd-content custom-pmd-content" id="content"> <h2 class="headline">Sidebar Constructor</h2> <p>This structure shows a permanent app bar with a floating action button. The app bar absorbs elements from the tablet and mobile bottom bars.</p> <p style="margin-bottom:0;">An optional bottom bar can be added for additional functionality or action overflow. A side nav overlays all other structural elements. A right nav menu can be accessed temporarily or pinned for permanent display.<br><br></p> </div> <div class="pmd-sidebar-overlay"></div> </section>
Código CSS:
/* Bootstrap css */ @import "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"; /* Propeller typography */ @import "http://propeller.in/components/typography/css/typography.css"; /* Propeller navbar */ @import "http://propeller.in/components/navbar/css/navbar.css"; /* Propeller dropdowns */ @import "http://propeller.in/components/dropdown/css/dropdown.css"; /* Propeller buttons */ @import "http://propeller.in/components/button/css/button.css"; /* Propeller list */ @import "http://propeller.in/components/list/css/list.css"; /* Propeller icons */ @import "http://fonts.googleapis.com/icon?family=Material+Icons"; @import "http://propeller.in/components/icons/css/google-icons.css"; /* Propeller sidebar */ @import "http://propeller.in/components/sidebar/css/sidebar.css";
Código JS:
<!-- Jquery js --> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <!-- Bootstrap js --> <script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <!-- Propeller Global js --> <script src="http://propeller.in/components/global/js/global.js"></script> <!-- Propeller Dropdown js --> <script type="text/javascript" language="javascript" src="http://propeller.in/components/dropdown/js/dropdown.js"></script> <!-- Propeller ripple effect js --> <script type="text/javascript" language="javascript" src="http://propeller.in/components/button/js/ripple-effect.js"></script> <!-- Propeller Sidebar js --> <script type="text/javascript" language="javascript" src="http://propeller.in/components/sidebar/js/sidebar.js"></script>
Me ajudem por favor.
-
Pessoal que manja de Material Designer do Google me ajudem por favor!
Se alguém poder me ajudar ou dizer qual o erro estou cometendo eu agradeceria, estou a semanas tentando fazer algo que em teoria e muito simples.
Quero fazer apenas isso:
Não estou conseguindo fazer funcionar os códigos do material.io no meu projeto, já tentei de tudo, uso via CDN, ja instalei na pasta do projeto via NPM.
e pelo que vi no F12 o problema ta sendo no JS e ta dando isso pra mim:
Meu gerenciador de produções está assim:
Código da minha pag "_Layout.cshtml"
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>@ViewData["Title"] - Login</title> <link rel="stylesheet" href="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.css"> <link href="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.css" rel="stylesheet"> <script src="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.js"></script> <!--LINK CSS pasta--> <link rel="stylesheet" href="~/css/site.css" /> <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> </head> <body> <header> <h3>ANÁLISE CRIMINAL</h3> </header> @RenderBody() <div class="container"> <footer id="footer"> <p class="foot"> © @DateTime.Now.Year - Secretaria de Estado de Segurança Pública - SSP/SMT - Subsecretaria de Modernização Tecnológica.<br /> Versão: <span hidden>A PREENCHER</span> <br /> </p> </footer> </div> <!-- Required MDC Web JavaScript library --> <script src="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.js"></script> <!-- Instantiate single textfield component rendered in the document --> <script> mdc.textField.MDCTextField.attachTo(document.querySelector('.mdc-text-field')); </script> <!--LINK JAVASCRIPT pasta--> <script type="text/javascript" src="~/js/site.js"></script> <script type="text/javascript" src="~/js/site1.js"></script> @RenderSection("Scripts", required: false) </body> </html>
Código da minha pag secundária que é pra rodar a TAG BAR do Material.io
<div class="mdc-tab-bar" role="tablist"> <div class="mdc-tab-scroller"> <div class="mdc-tab-scroller__scroll-area"> <div class="mdc-tab-scroller__scroll-content"> <button class="mdc-tab mdc-tab--active" role="tab" aria-selected="true" tabindex="0"> <span class="mdc-tab__content"> <span class="mdc-tab__icon material-icons" aria-hidden="true">favorite</span> <span class="mdc-tab__text-label">contents</span> </span> <span class="mdc-tab-indicator mdc-tab-indicator--active"> <span class="mdc-tab-indicator__content mdc-tab-indicator__content--underline"></span> </span> <span class="mdc-tab__ripple"></span> </button> <button class="mdc-tab mdc-tab--active" role="tab" aria-selected="true" tabindex="0"> <span class="mdc-tab__content"> <span class="mdc-tab__icon material-icons" aria-hidden="true">favorite</span> <span class="mdc-tab__text-label">Favorites</span> </span> <span class="mdc-tab-indicator mdc-tab-indicator--active"> <span class="mdc-tab-indicator__content mdc-tab-indicator__content--underline"></span> </span> <span class="mdc-tab__ripple"></span> </button> <button class="mdc-tab mdc-tab--active" role="tab" aria-selected="true" tabindex="0"> <span class="mdc-tab__content"> <span class="mdc-tab__icon material-icons" aria-hidden="true">favorite</span> <span class="mdc-tab__text-label">nearby</span> </span> <span class="mdc-tab-indicator mdc-tab-indicator--active"> <span class="mdc-tab-indicator__content mdc-tab-indicator__content--underline"></span> </span> <span class="mdc-tab__ripple"></span> </button> </div> </div> </div> </div>
Meu código CSS
Obs: o css do formulário é o que estou fazendo a TAG BAR
@import "@material/textfield/mdc-text-field"; body { margin: auto; padding: 0; font-family: Roboto; } /*------------------ EDIÇÃO - LOGIN ---------------------*/ header { margin: 0; background-color: #f2f2f2; padding: 5px; border-style: solid; border-color: #e6e6e6; } header h3{ font-family: Stencil; font-size: 2.3em; color: #dad5d5; text-shadow: 2px 2px 4px #000000; text-align:center; } footer p { text-align: center; color: #0086b3; font-size:1em; } #footer{ text-align:center; margin-top: 1em; } .container-fluid { background-color: ; } .container { background-color: #f2f2f2; margin-top: 1.5em; border-style: solid; border-color: #e6e6e6; border-radius: 5px; } .img-fluid{ width: 350px; height: 350px; } .logossp{ margin-top:5em; } .form-group-bottom{ margin-bottom:1px; } .form-group-bottom1{ margin-bottom:1.5em; } /*------------------ EDIÇÃO - PESQUISA ---------------------*/ .form-pesquisa{ padding:2em; } /*------------------- EDIÇÃO - FORMULÁRIO-------------------*/ @import "@material/tab-bar/mdc-tab-bar"; @import "@material/tab-scroller/mdc-tab-scroller"; @import "@material/tab-indicator/mdc-tab-indicator"; @import "@material/tab/mdc-tab"; @import "./mixins"; @include mdc-tab-bar-core-styles; html, body { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 32px; box-sizing:border-box; } .demo-headline { margin-bottom: 32px; } .mdc-text-field { margin-bottom: 24px; flex-shrink: 0; } .greet-message { margin-top: 48px; }
Código do JavaScript que ta dando ERRO
import { MDCFoo, MDCFooFoundation } from '@material/foo'; import { MDCFoo, MDCFooFoundation } from '@material/foo/index'; const mdcFoo = require('mdc-foo'); const MDCFoo = mdcFoo.MDCFoo; const MDCFooFoundation = mdcFoo.MDCFooFoundation; require(['path/to/mdc-foo'], mdcFoo => { const MDCFoo = mdcFoo.MDCFoo; const MDCFooFoundation = mdcFoo.MDCFooFoundation; }); const MDCFoo = mdc.foo.MDCFoo; const MDCFooFoundation = mdc.foo.MDCFooFoundation; // ACIMA E TESTE - APAGA TALVEZ const buttons = document.querySelectorAll('.mdc-button'); for (const button of buttons) { mdc.ripple.MDCRipple.attachTo(button); } const textFields = document.querySelectorAll('.mdc-text-field'); for (const textField of textFields) { mdc.textField.MDCTextField.attachTo(textField); } import { MDCTextField } from '@material/textfield/index'; /** Custom javascript code. */ const greetMessageEl = document.querySelector('.greet-message'); const greetButton = document.querySelector('.greet-button'); greetButton.addEventListener('click', () => { const firstNameInput = document.querySelector('.first-name-input').value; const lastNameInput = document.querySelector('.last-name-input').value; let name; if (firstNameInput || lastNameInput) { name = firstNameInput + ' ' + lastNameInput; } else { name = 'Anonymous'; } greetMessageEl.textContent = `Hello, ${name}!`; });
Segundo código JavaScript 2 (outra pag de JS)
Também esta dando erro.
import { MDCTabBar } from '@material/tab-bar'; const tabBar = new MDCTabBar(document.querySelector('.mdc-tab-bar')); import { MDCTabScroller } from '@material/tab-scroller'; const tabScroller = new MDCTabScroller(document.querySelector('.mdc-tab-scroller')); import { MDCTabIndicator } from '@material/tab-indicator'; const tabIndicator = new MDCTabIndicator(document.querySelector('.mdc-tab-indicator'));
-
30 minutos atrás, Leonardo0308 disse:
Coloca o código que você está fazendo aqui, assim a gente pode te ajudar a resolver o problema.
Não tenho esse código, mas deve ta cheio de modelos pela internet.
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>@ViewData["Title"] - Login</title> <environment include="Development"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous"> <link rel="stylesheet" href="~/css/site.css" /> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bs-stepper/dist/css/bs-stepper.min.css" /> </environment> <environment exclude="Development"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous"> <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" /> <link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet"> </environment> </head>
Acima o código HTML do Head.
Já a pág css, n tem nenhuma edição ainda, porque peguei esse step na internet já criado, porém ainda não é do jeito que eu quero, pois eu quero usar um step no estilo do site: material.io.
Estilo material designe, com efeito e mais suave.
-
4 minutos atrás, Leonardo0308 disse:
Bom dia @Mizrain Phelipe Sá
Você está colando todos os arquivos/códigos? Pois parece que está sem o CSS.
Estou, mais se poder me mandar um código de stepper que você tenha feito eu agradeceria, porque não sei o que estou fazendo errado.
-
Pessoal estou tentando colocar uns "Steppers" na minha página web mais embora coloque os códigos que pego na web ele não funciona, gostaria de saber o que preciso para fazer os steppers funcionarem?
Obs: Já usei vários códigos e nenhum funciono, fico apenas assim:
E eu quero steppers pra ficar assim:
Alguém pode me ajudar por favor? Se poder envie os códigos de steppers que tenham para eu poder usar.
desde já agradeço!
-
@brund321 Obrigado, mas só consegui resolver assim:
.form-control:focus{ border-color: inherit; -webkit-box-shadow: none; box-shadow: none; }
-
Pessoal como faço para tirar a borda azul padrão da input quando você clica nela?
Obs: Estou usando um form do Bootstrap, aqui o código html dele:
<form class="form-inline my-2 my-lg-0"> <input class="form-control mr-sm-2" type="search" placeholder="Pesquisar" aria-label="Pesquisar"> <button class="btn my-2 my-sm-0" type="submit"><span class="pesquisar">Pesquisar</span></button> </form>
Se alguém souber como tirar essa borda de focus eu gradeceria muito.
-
Consegui resolver simplesmente salvando o arquivo de fonts na mesma pasta do arquivo web sem criar uma subpasta para tal.
- 1
-
Pessoal estou tentando usar as icons fonts do site IcoMoon, eu escolhi os icons, baixei e linquei na minha página, porém quando eu abro o arquivo web o icon não aparece e sim o seu character, alguém sabe como resolvo isso?
Meu código HTML:
<!DOCTYPE html> <!-- DOCTYPE informa ao agente de usuario a versão do html que deve ser renderizada --> <html lang="pt-br"> <head> <title>responsivo</title> <!-- essas são as METATAGS elas só ficam dentro da TAG <head> e n são visiveis aos usuários --> <meta charset="utf-8"> <meta name="author" content="Felipe"> <!-- tag para identificar o autor da página --> <meta name="description" content="um exemplo apenas"> <!-- tag para dar uma descrição a página que pode aparecer nas descrições do site qd exibidas no google para o usuário --> <meta name="keywords" content="html5, tecnologia"> <!-- tag para colocar PALAVRAS-CHAVES na página --> <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Oxygen:400,300,700"> <link rel="stylesheet" href="iconmoon/style.css"> <!-- aqui estou linkando o arquivo css dos iconsfonts que eu baixei na net para usálos na minha página --> <link rel="stylesheet" href="css/normalize.css"> <!-- NORMALIZE baixe na NET e use para deixar a página mais aceita em todos os browsers --> <link rel="stylesheet" href="css/main.css"> </head> <body> <header class="top-header"> <img src="images/logo_mob.svg" alt="Logotipo" class="top-header-logo"> <nav class="top-nav"> <ul> <li><a href="#">Home</a></li> <li><a href="#">Produtos</a></li> <li><a href="#">Serviços</a></li> <li><a href="#">Contato</a></li> </ul> </nav> </header> <section class="top-content"> <h1 class="top-content-title">A exciting new venture over the range</h1> <h2 class="top-content-subtitle">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua consectetur adipisicing elit.</h2> <a href="#" class="button">Get Started</a> </section> <section> <article> <span class="icon-stopwatch"></span> <h3>Designer Guff</h3> <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p> </article> <article> <h3>Detaild Stats</h3> <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p> </article> <article> <h3>Dashboard</h3> <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p> </article> <article> <h3>Development</h3> <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p> </article> </section> <section> <article> <h3>Designg Heading</h3> <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p> </article> <article> <h3>Designg Trends</h3> <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p> </article> <article> <h3>Designg Users</h3> <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p> <a href="#">Get Started</a> </article> <article> <h3>Designg Goals</h3> <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p> <a href="#">Buy Now</a> </article> </section> <footer> <ul> <li><a href="#">Facebook</a></li> <li><a href="#">Twitter</a></li> <li><a href="#">Google Plus</a></li> </ul> <p>Copyright The Range</p> <p>Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum</p> </footer> </body> </html>
Até mesmo o arquivo "demo" que veio na pasta junto com os icons só esta aparecendo em character...
<!doctype html> <html> <head> <meta charset="utf-8"> <title>IcoMoon Demo</title> <meta name="description" content="An Icon Font Generated By IcoMoon.io"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="demo-files/demo.css"> <link rel="stylesheet" href="style.css"></head> <body> <div class="bgc1 clearfix"> <h1 class="mhmm mvm"><span class="fgc1">Font Name:</span> icomoon <small class="fgc1">(Glyphs: 7)</small></h1> </div> <div class="clearfix mhl ptl"> <h1 class="mvm mtn fgc1">Grid Size: 16</h1> <div class="glyph fs1"> <div class="clearfix bshadow0 pbs"> <span class="icon-clock"></span> <span class="mls"> icon-clock</span> </div> <fieldset class="fs0 size1of1 clearfix hidden-false"> <input type="text" readonly value="e94e" class="unit size1of2" /> <input type="text" maxlength="1" readonly value="" class="unitRight size1of2 talign-right" /> </fieldset> <div class="fs0 bshadow0 clearfix hidden-true"> <span class="unit pvs fgc1">liga: </span> <input type="text" readonly value="clock, time2" class="liga unitRight" /> </div> </div> <div class="glyph fs1"> <div class="clearfix bshadow0 pbs"> <span class="icon-stopwatch"></span> <span class="mls"> icon-stopwatch</span> </div> <fieldset class="fs0 size1of1 clearfix hidden-false"> <input type="text" readonly value="e952" class="unit size1of2" /> <input type="text" maxlength="1" readonly value="" class="unitRight size1of2 talign-right" /> </fieldset> <div class="fs0 bshadow0 clearfix hidden-true"> <span class="unit pvs fgc1">liga: </span> <input type="text" readonly value="stopwatch, time5" class="liga unitRight" /> </div> </div> <div class="glyph fs1"> <div class="clearfix bshadow0 pbs"> <span class="icon-cog"></span> <span class="mls"> icon-cog</span> </div> <fieldset class="fs0 size1of1 clearfix hidden-false"> <input type="text" readonly value="e994" class="unit size1of2" /> <input type="text" maxlength="1" readonly value="" class="unitRight size1of2 talign-right" /> </fieldset> <div class="fs0 bshadow0 clearfix hidden-true"> <span class="unit pvs fgc1">liga: </span> <input type="text" readonly value="cog, gear" class="liga unitRight" /> </div> </div> <div class="glyph fs1"> <div class="clearfix bshadow0 pbs"> <span class="icon-stats-bars2"></span> <span class="mls"> icon-stats-bars2</span> </div> <fieldset class="fs0 size1of1 clearfix hidden-false"> <input type="text" readonly value="e99d" class="unit size1of2" /> <input type="text" maxlength="1" readonly value="" class="unitRight size1of2 talign-right" /> </fieldset> <div class="fs0 bshadow0 clearfix hidden-true"> <span class="unit pvs fgc1">liga: </span> <input type="text" readonly value="stats-bars2, stats4" class="liga unitRight" /> </div> </div> <div class="glyph fs1"> <div class="clearfix bshadow0 pbs"> <span class="icon-google-plus"></span> <span class="mls"> icon-google-plus</span> </div> <fieldset class="fs0 size1of1 clearfix hidden-false"> <input type="text" readonly value="ea8b" class="unit size1of2" /> <input type="text" maxlength="1" readonly value="" class="unitRight size1of2 talign-right" /> </fieldset> <div class="fs0 bshadow0 clearfix hidden-true"> <span class="unit pvs fgc1">liga: </span> <input type="text" readonly value="google-plus, brand5" class="liga unitRight" /> </div> </div> <div class="glyph fs1"> <div class="clearfix bshadow0 pbs"> <span class="icon-facebook"></span> <span class="mls"> icon-facebook</span> </div> <fieldset class="fs0 size1of1 clearfix hidden-false"> <input type="text" readonly value="ea90" class="unit size1of2" /> <input type="text" maxlength="1" readonly value="" class="unitRight size1of2 talign-right" /> </fieldset> <div class="fs0 bshadow0 clearfix hidden-true"> <span class="unit pvs fgc1">liga: </span> <input type="text" readonly value="facebook, brand10" class="liga unitRight" /> </div> </div> <div class="glyph fs1"> <div class="clearfix bshadow0 pbs"> <span class="icon-twitter"></span> <span class="mls"> icon-twitter</span> </div> <fieldset class="fs0 size1of1 clearfix hidden-false"> <input type="text" readonly value="ea96" class="unit size1of2" /> <input type="text" maxlength="1" readonly value="" class="unitRight size1of2 talign-right" /> </fieldset> <div class="fs0 bshadow0 clearfix hidden-true"> <span class="unit pvs fgc1">liga: </span> <input type="text" readonly value="twitter, brand16" class="liga unitRight" /> </div> </div> </div> <!--[if gt IE 8]><!--> <div class="mhl clearfix mbl"> <h1>Font Test Drive</h1> <label> Font Size: <input id="fontSize" type="number" class="textbox0 mbm" min="8" value="48" /> px </label> <input id="testText" type="text" class="phl size1of1 mvl" placeholder="Type some text to test..." value=""/> <div id="testDrive" class="icon-" style="font-family: icomoon"> </div> </div> <!--<![endif]--> <div class="bgc1 clearfix"> <p class="mhl">Generated by <a href="https://icomoon.io/app">IcoMoon</a></p> </div> <script src="demo-files/demo.js"></script> </body> </html>
Alguém me ajuda por favor?
adicionado 38 minutos depoisJá consegui resolver.
-
@GabrielSennaMs Resolveu completamente meu problema.
Muito obrigado!
-
Pessoal me ajudem por favor!
Estou a dias tentando resolver o problema desse espaço em branco sobrando na parte right da tela que não consigo tirar de jeito nenhum pra body completar a página toda. Eu estou usando o Bootstrap e o Grid para fazer os blocos, a página está semântica porém fica aquele espaço sobrando >>>
Alguém sabe como resolvo isso por favor?
Código html:
<!DOCTYPE html> <html lang="pt-br"> <head> <!-- Meta tags Obrigatórias --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <!-- Bootstrap CSS --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous"> <title>Secretaria de Segurança Pública!</title> </head> <body> <div class="container-fluid"> <div class="row"> <!-- LINHA --> <div class="col"> <!-- COLUNA --> <header> <h1>Análise Criminal</h1> </header> </div> </div> <!-- container dos BLOCOS --> <main> <div class="row"> <!-- LINHA 2 --> etc,etc,etc... </main> <!-- container dos BLOCOS--> </div> <!-- container-fluid --> <!-- JavaScript (Opcional) --> <!-- jQuery primeiro, depois Popper.js, depois Bootstrap JS --> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script> </body> </html>
Código CSS:
body{ font-family: arial black; margin: 0; padding: 0; } header{ background-color: black; } h1{ color: white; text-align: center; } h1:hover{ color: red; cursor: default; } h4{ text-align: center; color: white; margin-top: 20px; font-size: 25px; } #yellow{ color: black; } main .row{ margin-bottom: 5px; width: 110%; }
Sobre o Clube do Hardware
No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas comunidades sobre tecnologia do Brasil. Leia mais
Direitos autorais
Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais
Função em javascript atrapalhando a outra!
em Web e banco de dados
Postado
Eu fiz seguindo suas dicas mais mesmo assim continua dando erro, se poder me mostrar a correção no meu próprio código eu agradeceria.
Obs: ainda apanho muito pra JS