Skip to main content
SnikketyNikkety
SnikketyNikkety
Participant
January 6, 2018
Answered

Ruined bootstrap.css?

  • January 6, 2018
  • 2 replies
  • 614 views

Beginner. iMac High Sierra 10.13.2. DWCC 10.13.6

I have two open bootstrap files:  bootstrap.css and a blank. I am learning how to borrow code from bootstrap.css to a blank page. I close and reopen bootstrap and a new blank file when I screw up.  (I am following a Lynda.com course.)

Now when I open bootstrap.css, it's asking if I want to rewrite it. I have to click 'OK' or it won't open. Have I ruined the bootstrap.css file?

Thank you,

Cheryl <-- 60 years old, grey hair, please be gentle.

Message was edited by: Cheryl Ballantyne i.e. poor user editing skills

    This topic has been closed for replies.
    Correct answer Nancy OShea

    Unless you're an expert coder, DO NOT OPEN Bootstrap or jQuery  files.  Never, never, never open them. You should be using a separate external CSS file for your custom styles.

    Copy and paste this code into a new, blank document.  You can't edit these Bootstrap and jQuery files because they are hosted on CDNs.

    <!doctype html>

    <html lang="en">

    <head>

    <meta charset="utf-8">

    <title>Bootstrap</title>

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <!-- Latest Bootstrap 3 CSS-->

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

    <!--CUSTOM CSS GOES HERE-->

    <link rel="stylesheet" href="YOUR_STYLEHSEET.css">

    </head>

    <body class="container">

    <div class="row">

    <div class="col-md-10 center-block">

    CONTENT GOES HERE....

    </div>

    </div>

    <!--latest jQuery 3 JS-->

    <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>

    <!--Latest Bootstrap 3 JS-->

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

    </body>

    </html>

    2 replies

    BenPleysier
    Community Expert
    BenPleysierCommunity Expert
    Community Expert
    January 7, 2018

    Which Lynda.com course are you following and which version of Bootstrap have you deployed?

    Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
    SnikketyNikkety
    SnikketyNikketyAuthor
    Participant
    January 7, 2018

    Thanks, Ben!

    I am following "Designing Websites From Photoshop to Dreamweaver'.  I am on the lesson titled 'Create A Bootstrap file'.  I have done well  till this overwrite question kept popping up. I am enjoying it very much as I work toward a complete update of my charity's website (nothing has changed since 2010).

    Your second question is harder for me to answer with my level of knowledge. In Dreamweaver, I am instructed go to File -->New --> New Document --> HTML --> Bootstrap tab. I'm instructed to select 'Create New'. Turn on 'Include a pre-built layout' and click Create. I hope that's the info you need.

    Nancy OShea
    Community Expert
    Nancy OSheaCommunity ExpertCorrect answer
    Community Expert
    January 6, 2018

    Unless you're an expert coder, DO NOT OPEN Bootstrap or jQuery  files.  Never, never, never open them. You should be using a separate external CSS file for your custom styles.

    Copy and paste this code into a new, blank document.  You can't edit these Bootstrap and jQuery files because they are hosted on CDNs.

    <!doctype html>

    <html lang="en">

    <head>

    <meta charset="utf-8">

    <title>Bootstrap</title>

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <!-- Latest Bootstrap 3 CSS-->

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

    <!--CUSTOM CSS GOES HERE-->

    <link rel="stylesheet" href="YOUR_STYLEHSEET.css">

    </head>

    <body class="container">

    <div class="row">

    <div class="col-md-10 center-block">

    CONTENT GOES HERE....

    </div>

    </div>

    <!--latest jQuery 3 JS-->

    <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>

    <!--Latest Bootstrap 3 JS-->

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

    </body>

    </html>

    Nancy O'Shea— Product User & Community Expert
    SnikketyNikkety
    SnikketyNikketyAuthor
    Participant
    January 7, 2018

    Thank you very much, Nancy!

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices