Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Aug 17 09:32
    User @bjorno43 unbanned @linkin-park
  • Jun 20 21:19
    @bjorno43 banned @shenerd140
  • Apr 25 17:13
    @mstellaluna banned @cmal
  • Jan 08 22:05
    @mstellaluna banned @dertiuss323
  • Nov 07 2018 04:42
    User @texas2010 unbanned @ows-ali
  • Nov 02 2018 16:25
    @texas2010 banned @ows-ali
  • Oct 12 2018 05:50
    @bjorno43 banned @NACH74
  • Oct 05 2018 23:02
    @mstellaluna banned @JomoPipi
  • Sep 16 2018 12:21
    @bjorno43 banned @yash-kedia
  • Sep 16 2018 12:16
    @bjorno43 banned @vnikifirov
  • Sep 05 2018 08:12
    User @bjorno43 unbanned @androuino
  • Sep 05 2018 07:38
    @bjorno43 banned @androuino
  • Aug 23 2018 16:57
    User @bjorno43 unbanned @rahuldkjain
  • Aug 23 2018 16:23
    @bjorno43 banned @rahuldkjain
  • Jul 29 2018 14:13
    User @bjorno43 unbanned @jkyereh
  • Jul 29 2018 01:00
    @bjorno43 banned @jkyereh
  • Jul 10 2018 22:09
    @bjorno43 banned @manafn
  • Jul 06 2018 15:20
    @texas2010 banned @imlegend19
  • Jul 03 2018 12:28
    @bjorno43 banned @vbvmatta
  • Jun 29 2018 13:54
    @bjorno43 banned @OGTechnoBoy
Kamal
@kpbro
hello.. i am stuck in portfolio page
here background color in contact section is not covering the entire area
The background color of form is white instead of the color i have set
Gulsvi
@gulsvi

@Donnie-D @lydatech You *can* set the body height - try adding a border and you'll see the height is applied:

body {
  background-color: green;
  border: 1px solid black;
  height: 50px;
}

The issue you're seeing is with the background-color property. When no background-color is specified for the html element, the body background will cover the entire page. To only have your green background apply to a smaller height body, you would need to apply a background to both the html and body elements, like:

html {
  background-color: white;
}
body {
  background-color: green;
  height: 50px;
}
Daniel Simeonov
@dbsimeonov

Guys can you tip me what I'm doing wrong with those css animations? On the page you can see demo as well.

When you click on any of the links(top right corner) it opens something like modal that its pain for me to create a smooth animation? What I'm doing wrong?
https://github.com/dbsimeonov/hennessy

markclynch
@markclynch
body {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
  line-height: 1.5;
  padding:0;
  margin:0;
  background-color:rgb(247, 244, 243)
}

/* GLOBAL */
.container {
  width: 80%;
  margin:auto;
  overflow:hidden;
}

/* HEADER */
header {
  background: #431906;
  color: #ffffff;
  padding-top: 30px;
  min-height:70px;
  border-bottom:#337616 8px solid;
}

header a{
  color: #ffffff;
  text-decoration: none;
  text-transform: uppercase;
  font-size:16px;
}

header ul {
  margin:0;
  padding:0;
}

header li{
  float:left;
  display: inline;
  padding: 0 20px 0 20px;
}

header #branding {
  float:left;
}

header #branding h1 {
  margin:0;
}
header nav{
  float:right;
  margin-top: 10px;
}

header .highlight, header .current a{
  color: #46C211;
  font-weight: bold;
}

header a:hover{
  color:rgb(49, 53, 124);
  font-weight: bold;
}

/* SHOWCASE */

#showcase {
  min-height:400px;
  background-img: url('./Images/showcase.jpg') no-repeat 0 -400px;
  text-align: center;
  color:#ffffff;
}

#showcase h1{
  margin-top:100px;
  font-size:55px;
  margin-bottom:10px;
}
Can anyone help me figure out why my #showcase image isn't showing at all?
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Fordyce Custom Carpentry</title>
<!--FAVICON CODE-->

<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">

<link rel="manifest" href="/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<!--END FAVICON CODE-->
<link rel="stylesheet" href="style.css">
</head>
<body>
  <header>
    <div class="container">
      <div id="branding">
        <h1>Fordyce Custom Carpentry</h1>
      </div>
      <nav>
        <ul>
          <li class="current"><a href="index.html">Home</a></li>
          <li><a href="about.html">About</a></li>
          <li><a href="gallery.html">Gallery</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
      </nav>
    </div>

  </header>
  <section id="showcase">
    <div class="container">
      <h1>Finish Carpentry at its finest in Santa Barbara</h1>
      <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Temporibus quos quidem excepturi nostrum in, quas dignissimos non numquam a laboriosam!</p>
    </div>
  </section>



  <section id="boxes">
    <div class="container">
      <div class="box">
        <img src="./Images/Entry_Door.jpg" alt="">
        <h3>Custom Entryway</h3>
        <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ad, id.</p>
      </div>
      <div class="box">
          <img src="./Images/cabinet.jpg" alt="">
        <h3>Cabinetry</h3>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Deserunt, nam!</p>
      </div>
      <div class="box">
          <img src="./Images/Deck.jpg" alt="">
        <h3>Deck and Railing</h3>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nostrum, voluptatum voluptate!</p>
      </div>
    </div>
  </section>
</body>
</html>
Relavent CSS then HTML attached :) Thanks!
Brad
@bradtaniguchi
holy code batman
markclynch
@markclynch
lol, I thought it would help
Since I've got no clue where the mistake is!
Brad
@bradtaniguchi
My guess is how your doing your url, or the image doesn't exist at that url at all
Michael Grienauer
@mgrienauer
@sjames1958gm @1532j0004kg thanks
Zebralight
@zebralight
hello. what property do non-window elements have that's the equivalent of window.scrollx/scrolly?
Daniel Simeonov
@dbsimeonov
Guys for creating animation with relative position that pushes my navbar from top, what css properties should I use? Can I do it with changing to absolute or height etc? Been trying for the past 3-4 hours but none of it seems to work smoothly
Norvin Burrus
@ndburrus
Daniel Simeonov
@dbsimeonov
Really appreciate the links, the first one definitely is worth reading it. Kind of waiting for your golden Google skills. The animation is quite similar than the first one, but the menu is outside the window and I want to push the top element. You can see what I've created so far or to understand my issue easier https://dbsimeonov.github.io/hennessy/
Norvin Burrus
@ndburrus
@dbsimeonov hmmm... what is the "top element"? i see a toggle activated side menu. i don't see any content that would (possibly?) allow me to see the/any issue? i don't think I understand what we're trying to do...
Daniel Simeonov
@dbsimeonov
try to click on sign up login or ssearch
Norvin Burrus
@ndburrus
@dbsimeonov ok, will do. btw i only see Log in & Create an account - no search...
Daniel Simeonov
@dbsimeonov
@ndburrus yes my bad, long day. Those 2 + search icon activating new elements from top
Amit Patel
@AmitP88
hey guys, on my twitch channels project, the cretetion channel is displaying as offline in the app, but when I click the link the twitch channel is live. I don't get why it's doing this. I thought I did the ajax calls correctly O_o
Norvin Burrus
@ndburrus
@dbsimeonov ok... i don't see any functionality (yet) on create an account or log in. i do see that Hennesey is sticky. so what are we trying to achieve? do we want the top section (ie everything) to be sticky?
Daniel Simeonov
@dbsimeonov
@ndburrus idea is just to create smooth animation to open them. I'm not bothered doing the functionality of them now. Only the animations look really bad but that was the closest I could do to smooth or to the original
Norvin Burrus
@ndburrus

i think your looking for smooth fade in/out?

  • Fade In/Out (scroll down to...)

    ...employ both visibility and opacity style attributes.

include*engine
@newtothat
im learning php now but dont know most people say you have to learn first js and it's framework
but i enjoy learning php more
am i in the right direction?
Gulsvi
@gulsvi
@markclynch Use background instead of background-img if you're specifying more than just the image path.
background: url("./Images/showcase.jpg") no-repeat 0 -400px;
not:
background-img: url("./Images/showcase.jpg") no-repeat 0 -400px;
(and, it's really helpful if you can copy/past that into a codepen for us to see rather than spamming walls of code here in chat!). For example: https://s.codepen.io/anon/pen/rvMEBR?editors=1100
include*engine
@newtothat
@gulsvi sounds like so professional
experienced
Gulsvi
@gulsvi
I started learning last summer here at FCC
include*engine
@newtothat
like you were absolute beginner?
Gulsvi
@gulsvi
I don't know about absolute - I used to write scripts to automate my minecraft farming lol
include*engine
@newtothat
i see
Gulsvi
@gulsvi
used a computer every day since I was 8yrs old, but no, never learned javascript before
include*engine
@newtothat
so where are yu now
i mean what is your technical or coding skills
Gulsvi
@gulsvi
I'm just waiting for the beta to finish before I get my front-end certificate, thinking about applying for a developer job over the summer
include*engine
@newtothat
good luck with that
Gulsvi
@gulsvi
Thanks :)