Giter Site home page Giter Site logo

Help on CSS about call-me-maybe HOT 16 CLOSED

jueyang avatar jueyang commented on July 19, 2024
Help on CSS

from call-me-maybe.

Comments (16)

jueyang avatar jueyang commented on July 19, 2024

Could you paste the code of your page in a gist? Thanks.

from call-me-maybe.

mmelton3 avatar mmelton3 commented on July 19, 2024

I did make the gist but It's not saving...

from call-me-maybe.

jueyang avatar jueyang commented on July 19, 2024

Did you click the "Create secret Gist" (or public, whichever you'd like) Button?

from call-me-maybe.

mmelton3 avatar mmelton3 commented on July 19, 2024

I made a public one today.

from call-me-maybe.

jueyang avatar jueyang commented on July 19, 2024

Great. Can you put the link here?

from call-me-maybe.

mmelton3 avatar mmelton3 commented on July 19, 2024

https://gist.github.com/mmelton3/ecf0cc2bf31b8b187178

from call-me-maybe.

jueyang avatar jueyang commented on July 19, 2024

OK. A few things:

  1. It's an html file, could you name it somethingsomething.html? That's how you would see the color coded syntax for html. Just go back to the gist, click on Edit on the top-right, and change the name.
  2. You mentioned the css not working. It seems that you have one <link> to the player.css outside of the <html> tag, which is not a correct structure to link to css. Notice where you place your bootstrap.css? That's where you should put your css files.

from call-me-maybe.

mmelton3 avatar mmelton3 commented on July 19, 2024

With the player tag outside of the html, the clips will still play so they are working. And I added the codes for the player to what was already on the bootstrap template, I'm not sure which part of the code corresponds to the CSS. Also I tried adding the code from the page directly into the bootstrap CSS and the players stopped working.

from call-me-maybe.

jueyang avatar jueyang commented on July 19, 2024

@mmelton3 You changed the description, instead of the file name.

Please remember the correct order for linking to stylesheets and js scripts is the first step to not introduce bugs to your webpage. I forked your gist, moved the link and script of soundcite to where they belong.

Please see what I changed. : https://gist.github.com/jueyang/f57a08497e90a6242b86/revisions

from call-me-maybe.

mmelton3 avatar mmelton3 commented on July 19, 2024

https://gist.github.com/mmelton3/ecf0cc2bf31b8b187178

I moved the audio player code from the top of the page, but that's not
really the issue...It's just missing the style.
and I'm not familiar with using github so I didn't know how to change the
title

On Thu, Feb 19, 2015 at 2:03 PM, Jue Yang [email protected] wrote:

OK. A few things:

  1. It's an html file, could you name it somethingsomething.html?
    That's how you would see the color coded syntax for html. Just go back to
    the gist, click on Edit on the top-right, and change the name.
  2. You mentioned the css not working. It seems that you have one
    to the player.css outside of the tag, which is not a correct
    structure to link to css. Notice where you place your bootstrap.css?
    That's where you should put your css files.


Reply to this email directly or view it on GitHub
#8 (comment).

*Monica Melton *
Freelance Master's Candidate
CUNY Graduate School of Journalism
(253) 590-9184
NYC News Service

from call-me-maybe.

jueyang avatar jueyang commented on July 19, 2024

@mmelton3 please see my comment above #8 (comment)

from call-me-maybe.

jueyang avatar jueyang commented on July 19, 2024

(accidental close, reopening)

from call-me-maybe.

mmelton3 avatar mmelton3 commented on July 19, 2024

Hey, I'm just now seeing this.
I think I'm just going to try and
rebuild the page from scratch at this point.
of just use Wordpress.

from call-me-maybe.

jueyang avatar jueyang commented on July 19, 2024

@mmelton3 You don't have to build the page from scratch because it's already there! Your current page looks like it just needs to link properly to the css. Is bootstrap.css in the css folder? Do you have the right webpage structure?

This is what you page looks like right now without the css: http://bl.ocks.org/jueyang/raw/f57a08497e90a6242b86/

from call-me-maybe.

mmelton3 avatar mmelton3 commented on July 19, 2024

I don't believe there's a CSS folder at all. I downloaded a bootstap CSS
template and put my code in it. But when I did the audio no longer worked.

I've moved things over to my wordpress site. This works for now but I will
need to know how to integrate the CSS for future projects.

Monica

On Sat, Feb 21, 2015 at 4:36 PM, Jue Yang [email protected] wrote:

@mmelton3 https://github.com/mmelton3 You don't have to build the page
from scratch because it's already there! Your current page looks like it
just needs to link properly to the css. Is bootstrap.css in the css
folder? Do you have the right webpage scaffold?

This is what you page looks like right now without the css:
http://bl.ocks.org/jueyang/raw/f57a08497e90a6242b86/


Reply to this email directly or view it on GitHub
#8 (comment).

*Monica Melton *
Freelance Master's Candidate
CUNY Graduate School of Journalism
(253) 590-9184
NYC News Service

from call-me-maybe.

jueyang avatar jueyang commented on July 19, 2024

Yes. Let's use this as a case study for the kind of things you'd like to
do. Depending on where your content lives, the css lives in different
places. In your webpage code it points to css/bootstrap.css, which
assumes you have a css folder set up. Some times just downloading bootstrap
would not work; you need to find where to put that css file.

We can discuss this so that you have a general understanding of how these
all work together :) Can you leave your email? We can continue to
chat/schedule a meeting on Slack.

On Sat, Feb 21, 2015 at 5:08 PM, mmelton3 [email protected] wrote:

I don't believe there's a CSS folder at all. I downloaded a bootstap CSS
template and put my code in it. But when I did the audio no longer worked.

I've moved things over to my wordpress site. This works for now but I will
need to know how to integrate the CSS for future projects.

Monica

On Sat, Feb 21, 2015 at 4:36 PM, Jue Yang [email protected]
wrote:

@mmelton3 https://github.com/mmelton3 You don't have to build the page
from scratch because it's already there! Your current page looks like it
just needs to link properly to the css. Is bootstrap.css in the css
folder? Do you have the right webpage scaffold?

This is what you page looks like right now without the css:
http://bl.ocks.org/jueyang/raw/f57a08497e90a6242b86/


Reply to this email directly or view it on GitHub
<#8 (comment)
.

*Monica Melton *
Freelance Master's Candidate
CUNY Graduate School of Journalism
(253) 590-9184
NYC News Service


Reply to this email directly or view it on GitHub
#8 (comment).

from call-me-maybe.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.