Bootstrap Newbie Help

HTML & CSS
1

I’m having problems linking my own CSS to a bootstrap template, even though I have it placed after Bootstraps CSS. I was trying to change the colour of the Navbar. Bootstrap code :-

<nav class="navbar navbar-default">
  <div class="container-fluid">

I’m presuming the class is written in CSS .navbar navbar-default {} I’ve tried many combinations and none of these work.

I then decided on something similar such as paragraphs and headers and I cannot get it to pick up the my CSS.

My CSS link is: <link rel="stylesheet" type="text/css" href="custom.css"> Yes I have double checked the CSS file is called custom.css and that it’s the correct path.

Please help? I’m generally not an eejit, but this is driving me to distraction. Many thanks for reading this post.

2

It could be due to specificity.
You should try looking at in in ‘Inspect’ in your browser to see where the style is coming from.

3

Hi @Puzzle! Can you show us what exactly you tried? The selector above won’t work for example; try

.navbar.navbar-default {
    /* etc. */
}

instead. And then as @SamA74 said, it could still be a specifity problem… IMHE it can be quite a pain to override bootstrap styles indeed. :-/

4

Hi
Many thanks, I can now customise the Navbar! The code I have for headers and paragraphs is:

.navbar.navbar-default {
background-color:#0000cc;
}

h5 {
font-family:Tahamo, Arial, Sans Serif;
font-color:#999999;
}

p {
font-family:Tahamo, Arial, Sans Serif;
font-size:11;
font-color:#6a6a6a;
}

My next question is how do I tile an image horizontally underneath the navigation bar? This is the bare website at the moment. www.buckstone.co.uk The proper one is at www.scottishgreatdaneclub.co.uk which is what I am updating using Bootstrap.

Puzzle. (Shona)

5

Adding a background image to the element should do that. a background will tile by default, though you can control it if needed.

6

Hi

My header and paragraphs still are working! Please help. Thanks.
Shona

7

To get that band of tartan, just an empty <div> will do with a background image. It will need a height or vertical padding to give it some size.
It could also be done with a border, which may be more semantic than an empty div.

8

Hi

That’s great and I’ve plenty to be going on with. Really appreciate your help. Kind thanks again.
Shona

9

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.