MontCode/GeneralChat

MontBot is alive!

Matt Richards

@mattjrichards

            <!-- Latest compiled and minified JavaScript -->
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    </body>
</html>

Then I have this at the bottom of my html.

h1 {
  color: green;
  font-size:4.0em;
  padding:0px;
  margin-top:0px;

I can change the padding and it works. But if I try to change the color or the font size it doesn't reflect the changes.

Lily Romano

@Lilyheart

Is the code being over written by something else? You wanna just stick the code in a dummy codepen file and i’ll grab it and you can delete the pen?

I was just trying to mock up some stuff with your code but the actual code might work better.

Matt Richards

@mattjrichards

It works in Codepen, but when I copy and paste the code from Codepen into Atom it doesn't work right. Although, in Codepen I don't have those Bootstrap links in the head. I'll copy and paste exactly what I have in Atom into Codepen. Gimmee a minute.

Lily Romano

@Lilyheart

coolie. then i’ll steal the code and make it local. easy code transferrance xD

David Castner

@davidjcastner

just got home from class

Lily Romano

@Lilyheart

Matt Richards

@mattjrichards

lol...here is the link. http://codepen.io/mattrichards/pen/xgXwdy

David Castner

@davidjcastner

I've used live reload once or twice but not in depth, I'm reading through the convo at the moment

Matt Richards

@mattjrichards

It's doing the same thing in Codepen. I think it may be the Bootstrap links.

Lily Romano

@Lilyheart

got i think, not tested.

in your code, move your stylesheet link to main.css to after bootstrap

you are loading bootstrap after and it’s overwriting.

David Castner

@davidjcastner

^ correct

Lily Romano

@Lilyheart

Screen Shot 2017-01-25 at 10.29.36 PM.png

David Castner

@davidjcastner

lol I was about to screenshot that

Lily Romano

@Lilyheart

If you inspect the element you can see the load order. i changed the color to white xD you can see the white crossed out and bootstrap above it.

Matt Richards

@mattjrichards

Yes!!! You are so awesome!

Lily Romano

@Lilyheart

this is chrome

we try xD

when i’m awake tomorrow i can tell you how to load bootstrap onto codepen unless David wants to take over xD. Typing in bed in awkward lol

Matt Richards

@mattjrichards

@Lilyheart Thank you. Awesome. You'll have to show me how you did that.

ok. don't want to keep u

Lily Romano

@Lilyheart

right click the part misbehaving and select inspect

David Castner

@davidjcastner

css that is declared is after other css takes priority provided the selectors are the same. for example:

h1 {
    color: green;
}

h1 {
    color: red;
}

in this example h1 will take the color red. Because you loaded Bootstraps css after your css, the bootstrap took priority

Matt Richards

@mattjrichards

So it matters in what order you put stuff in your html

David Castner

@davidjcastner

correct, especially loading other sources like css and javascript

Matt Richards

@mattjrichards

See, I learned this stuff but I forgot. So much info to take in! Thanks @davidjcastner

David Castner

@davidjcastner

That's why javascript files are put at the bottom of the body tag; lots of javascript depends on elements already being part of the DOM to function properly. Otherwise the script will look at the DOM and not find the element.

Lily Romano

@Lilyheart

my new fav thing

David Castner

@davidjcastner

@kilocycle I recommend looking at a short tutorial about the chrome debugger tool, it will help you greatly. I believe freeCodeCamp has one.

But you can always loo for a video which might give you a better idea of how to use it

Matt Richards

@mattjrichards

ah ha, i see. I'm so happy right now. I love it when stuff works.

Ok. I'll check it out.

Lily Romano

@Lilyheart

i do a little dance when things start workin

David Castner

@davidjcastner

Yes there is a section on freeCodeCamp called chrome developer tools (you can find it in the map), I would recommend going and doing as much of that, don;t worry that you're not doing challenges in order

feel free to tag me if you have any other questions, I'll probably be up for a little

Matt Richards

@mattjrichards

@Lilyheart @davidjcastner Thanks again. I'm going to get back to learning this stuff. I'm usually up pretty late at night into the morning.

David Castner

@davidjcastner

no problem that's what we're here for! oh btw for code pen, codepen takes all the html in the editor and inserts it into the body tag, so there is no need to add the doctype, html, head, or body tags. If you need to insert stuff into the head tag or want to add things like bootstrap, you add them in the settings. See screenshots below

Matt Richards

@mattjrichards

sweet. i knew about the head tags, but i wasn't sure about the other tags. thanks bud.

David Castner

@davidjcastner

@Lilyheart or anyone else that uses uncrustify/atom-beautifier, I am having trouble with indentation after java lambda expressions. I posted the issue on stackoverflow, but I thought I would ask here since I'm not getting any answers. http://stackoverflow.com/questions/41868364/how-to-indent-properly-after-java-lambda-expression-with-uncrustify-formatter

Lily Romano

@Lilyheart

Never lambda'd my java to date. Curious though.

I use atom-beautify. Let me see if it handles it any better.

denisemathis

@denisemathis

Hi Everyone, I am new to the Forum. My name is Denise.

Lily Romano

@Lilyheart

Hi Denise! What are you studying today?

denisemathis

@denisemathis

I am learning PHP. What about you?

Where communities thrive

People

Repo info

Activity