• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

Help setting the border around my footer

Participant ,
Mar 19, 2024 Mar 19, 2024

Copy link to clipboard

Copied

Thank you for helping me... I've been searching the community, and learning so much about so many things, but nothing that addresses my issue.  I can't figure out what I did to mess up the borders around my footer. I had an even border around the menu, only. No border around the copyright. https://www.greenbeaks.com/retailers.html

Views

1.2K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 19, 2024 Mar 19, 2024

Copy link to clipboard

Copied

Right now your copyright is within the footer section and the footer section has the css "border border-white". If you don't want a border around the copyright I would move that out of the footer section and remove the border-top border-white classes that are also on that div.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Mar 19, 2024 Mar 19, 2024

Copy link to clipboard

Copied

quote

Right now your copyright is within the footer section and the footer section has the css "border border-white". If you don't want a border around the copyright I would move that out of the footer section and remove the border-top border-white classes that are also on that div.


By @Ben M

 

I agree.

 

Structure you need to follow is add another 'container-fluid' <div> directly AFTER the closing </footer> tag. Add a 'row' <div> inside the 'container-fluid' <div> then move your <!--Copyright -->  <!-- Copyright --> code into the 'row' <div> as shown below:

 

 

<div class="container-fluid">
<div class="row" >

<!-- Copyright -->
<div class="text-center p-3 w-100">
<small>&copy;Copyright 2002-2024 GreenBeaks® Inc. All Rights Reserved</small><br>
<small>This site is powered by&nbsp; <a href="dairyairdesigns.com" class="text-black-50">Dairy Air Designs&reg;</a></small>
</div>
<!-- Copyright -->

</div>
<!-- end row -->
</div>
<!-- end container-fluid -->

 

 

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 19, 2024 Mar 19, 2024

Copy link to clipboard

Copied

Change footer class from border border-white to border border-dark

https://www.w3schools.com/bootstrap4/bootstrap_colors.asp.

 

Nancy O'Shea— Product User, Community Expert & Moderator

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 19, 2024 Mar 19, 2024

Copy link to clipboard

Copied

I hope you do not mind me answering beyond your question.

 

I have noticed that the proper Bootstrap workflow has not been followed. The construct when using Bootstrap is:

Container(s)->Row(s)->Col(s)->Content

 

I have therefore reconstructed the page for you to peruse and learn from. Starting with the <body>, I have changed this to 

 

 

 

<body class="pt-4">

 

 

 

between the <body> tag and the first <script> tag, I have come up with this code:

 

 

 

    <div class="container">
        <div class="row">
            <div class="col">
                <h6 class="text-center text-black-50">
                    We'd love to hear from you!
                    <a href="tel:6089681311" class="text-black-50">608-968-1311</a> or txt
                    <a href="tel:6089681311" class="text-black-50">608-482-5622</a>
                </h6>
            </div>
        </div>
        <div class="row justify-content-around align-items-center">
            <div class="col">
                <a href="index.html">
                    <img src="https://www.greenbeaks.com/images/logos/gblogotrans.png" alt="&copy; Copyright 2023 Twin Beaks© Aviary All Rights Reserved" width="225" height="73" class="img-fluid">
                </a>
            </div>
            <div class="col">
                <div class="loginBasket d-flex justify-content-end">
                    <a href="account.html"><img src="https://www.greenbeaks.com/images/icons/icons8-user-100(1).png" alt="login" width="35" height="35" /></a>
                    <form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
                        <input type="hidden" name="cmd" value="_cart">
                        <input type="hidden" name="business" value="NE36TX7CGG78S">
                        <input type="hidden" name="display" value="1">
                        <input type="image" src="images/icons/icons8-shopping-basket-100.png" alt="basket" width="32" height="32" border="0" name="submit">
                    </form>
                </div>
            </div>
        </div>
        <nav class="navbar navbar-expand-lg navbar-light">
            <a class="navbar-brand" href="#"></a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent1" aria-controls="navbarSupportedContent1" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button>
            <div class="collapse navbar-collapse" id="navbarSupportedContent1">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item active"> <a class="nav-link" href="index.html">Home <span class="sr-only">(current)</span></a> </li>
                    <li class="nav-item dropdown"> <a class="nav-link" href="herbsalad.html" id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Herb Salad&#8482; </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdown1"> <a class="dropdown-item" href="herbsalad.html">Herb Salad&#8482;</a> <a class="dropdown-item" href="herbs.html">Our Chosen Herbs&#8482;</a>
                        </div>
                    </li>
                    <li class="nav-item"> <a class="nav-link" href="hatched.html">Crushed Eggshell</a> </li>
                    <li class="nav-item"> <a class="nav-link" href="herbalive.html">Herb-a-Live Garden&#8482;</a> </li>
                    <li class="nav-item"> <a class="nav-link" href="habitats.html">Natural World Habitats&#8482;</a> </li>
                    <li class="nav-item dropdown"> <a class="nav-link" href="products.html" id="navbarDropdown2" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Our Products </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdown2"> <a class="dropdown-item" href="products.html">All of Our Products</a>
                            <a class="dropdown-item" href="herbsalad.html">Herb Salad&#8482;</a>
                            <a class="dropdown-item" href="herbs.html">Our Chosen Herbs&#8482;</a>
                            <a class="dropdown-item" href="hatched.html">Hatched! Eggshell&#8482;</a>
                            <a class="dropdown-item" href="herbalive.html">Herb-a-Live Garden&#8482;</a>
                            <a class="dropdown-item" href="habitats.html">Natural World Habitats&#8482;</a>
                            <a class="dropdown-item" href="interiors.html">Habitat Interiors&#8482;</a>
                            <a class="dropdown-item" href="sprout.html">Sprout-it-Out&#8482;</a>
                            <a class="dropdown-item" href="insect.html">Insect Complete&#8482;</a>
                            <a class="dropdown-item" href="millet.html">Millet Bouquets&#8482;</a>
                            <a class="dropdown-item" href="stew.html">Oyster Stew&#8482;</a>
                            <a class="dropdown-item" href="monster-mash.html">Monster Mash&#8482;</a>
                            <a class="dropdown-item" href="three-hens.html">Three Hens in a Tub&#8482;</a>
                            <a class="dropdown-item" href="nest.html">Best Nest&#8482;</a>
                            <a class="dropdown-item" href="lab.html">From the Lab&#8482;</a>
                            <a class="dropdown-item" href="bakery.html">Mother Hen's Bakery&#8482;</a>
                        </div>
                    </li>
                    <li class="nav-item"> <a class="nav-link" href="read-about-it.html">Read All About It!</a> </li>
                    <li class="nav-item"> <a class="nav-link" href="tba.html">Twin Beaks&reg; Aviary</a> </li>
                    <li class="nav-item"> <a class="nav-link" href="shopping.html">Store</a> </li>
                </ul>
            </div>
        </nav>
        <main>
            <div class="row mt-4">
                <div class="col"><img src="images/titles/title-retailers.jpg" alt="©Copyright 2023 GreenBeaks®, Inc.  All Rights Reserved" width="1387" height="402" class="img-fluid" /></div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    <h6 class="text-left"><a href="pdf/TBA-AppforDistribution.pdf" class="text-body text-black-50">Inquire about becoming a GreenBeaks® Merchant</a></h6>
                </div>
            </div>
            <div class="row mt-4">
                <div class="col">
                    <p class="font-italic">GreenBeaks® endorses our resellers of Twin Beaks® Aviary's Herb Salad&#8482;, with complete confidence and support. Unfortunately, there are some businesses that market their own avian herb imitation, using our trademarks Herb Salad&#8482; and Twin Beaks® Aviary. Their products can be unsafe for your bird. A false claim of being organic is a serious USDA offense. Question a product's authenticity and the maker's qualification. Contact <a href="mailto:support@greenbeaks.com" class="text-black-50"><span class="font-weight-bold">I'm Not Verified</span></a> if you have concerns. We've been helping your birds stay well for over 25 years. Keeping your bird safe and healthy has been Twin Beaks® Aviary's mission.</p>
                </div>
            </div>
            <div class="row">
                <div class="col">
                    <p class="mb-0">Learn why</p>
                    <a href="whatsin.html" class="text-black-50">
                        <h5>We Set the Bar</h5>
                    </a>
                </div>
            </div>
            <div class="row">
                <div class="col text-center">
                    <p><a href="retailers.html"><img src="images/icons/inspection-seal.png" width="73" height="71" alt="tba certified" class="img-fluid"></a>&nbsp;<a href="retailers.html" class="font-weight-bold">Our Authorized Dealers</a></p>
                </div>
            </div>
            <div class="row">
                <div class="col">
                    <p>If you believe a business is misrepresenting their product as one of ours, replicating our product's descriptions or masquerading as one of our resellers, please contact <a href="mailto:support@greenbeaks.com" class="text-black-50">ARE THEY AUTHORIZED?</a></p>
                </div>
            </div>
            <div class="row">
                <div class="col text-center">
                    <h5 class="font-italic">NORTHEAST</h5>
                </div>
            </div>
            <div class="row row-cols-1 row-cols-sm-2 row-cols-lg-3">
                <authorised-dealer title="My Safe Bird Store" description="Health Products from a Bird-free Environment" address="612 Tyler Street" city="Burlington, NJ 08016" phone="732-737-1010"></authorised-dealer>
                <authorised-dealer title="Bird Paradise" description="World's Largest Exotic Bird Store" address="551 E Rt 130 South" city="Burlington, NJ 08016" phone="609-747-7777"></authorised-dealer>
                <authorised-dealer title="Birds by Joe" description="Visit Our Site, Step into Our Store" address="265 RT 22" city="Greenbrook NJ 08812" phone="732-764-2473"></authorised-dealer>
                <authorised-dealer title="World of Birds" description="" address="15 Perry Street" city="Chester, NJ 07930" phone="908-879-2291"></authorised-dealer>
            </div>

            <div class="row">
                <div class="col">
                    <p class="small">Herb Salad&#8482; and Hatched!&#8482;are trademarks of Twin Beaks&reg; Aviary. The use or display of 'Herb Salad&#8482;', 'Hatched!&#8482;'or 'Twin Beaks&reg;' in packaging materials, product descriptions or advertising is strictly prohibited.</p>
                </div>
            </div>
        </main>
        <footer>
            <div class="row text-center row-cols-1  row-cols-sm-2  row-cols-lg-4 mt-4">
                <div class="col mb-4 mb-lg-0">
                    <h5 class="text-uppercase mb-4">Good to Know!</h5>
                    <ul class="list-unstyled mb-4">
                        <li><a href="index.html" class="text-black-50">Home</a></li>
                        <li><a href="retailers.html" class="text-black-50">Store Locations</a></li>
                        <li><a href="whatsin.html" class="text-black-50">What's In, What's Not</a></li>
                        <li><a href="best.html" class="text-black-50">We Set the Bar</a></li>
                        <li><a href="comments.html" class="text-black-50">It Could Happen to You!</a></li>
                        <li><a href="faq.html" class="text-black-50">Glad You Asked!</a></li>
                    </ul>
                </div>
                <div class="col mb-4 mb-lg-0">
                    <h5 class="text-uppercase mb-4">Policies</h5>
                    <ul class="list-unstyled">
                        <li><a href="about.html" class="text-black-50">About Us</a></li>
                        <li><a href="policies.html" class="text-black-50">Returns</a></li>
                        <li><a href="policies.html" class="text-black-50">Shipping</a></li>
                        <li><a href="policies.html" class="text-black-50">Wholesale</a></li>
                        <li><a href="policies.html" class="text-black-50">501c3 Policy</a></li>
                        <li><a href="policies.html" class="text-black-50">Trade-In Offer</a></li>
                    </ul>
                </div>
                <div class="col mb-4 mb-lg-0">
                    <h5 class="text-uppercase mb-4">let's talk!</h5>
                    <ul class="list-unstyled">
                        <li>
                            <a href="mailto:support@greenbeaks.com" class="text-black-50">Contact Support</a><br>
                            <a href="mailto:sales@greenbeaks.com" class="text-black-50">Request a Quote</a><br>
                            <a href="tel:6089681311" class="text-black-50">608-968-1311 or</a><br>
                            <a href="tel:6084825622" class="text-black-50">608-482-5622</a><br>
                            <a class="text-black-50">Mon-Fri 9:00-5:00pm<br>
                                (GMT Chicago) </a>
                        </li>
                    </ul>
                </div>
                <div class="col mb-4 mb-lg-0">
                    <h5 class="text-uppercase mb-4">Sign up for our newsletter</h5>
                    <form>
                        <div class="form-group col-xl-12">
                            <input type="email" class="form-control" id="exampleInputEmail" placeholder="Enter email">
                            <button type="submit" class="btn btn-outline-black-50 btn-block">Subscribe</button>
                        </div>
                    </form>
                    <a href="tel:6089681311"><img src="images/icons/call_phone_calling_icon_193497.png" width="30" height="30" alt="phone" class="img-fluid"></a>
                    <a href="mailto:support@greenbeaks.com"><img src="images/icons/icons8-email-sign-50).png" alt="email" width="30" height="30" class="img-fluid" /></a>&nbsp;
                    <a href="tel:6089681311"><img src="images/icons/icons8-chat-bubble-100.png" alt="text msg" width="30" height="30" class="img-fluid" /></a>&nbsp;
                    <img src="images/icons/icons8-facebook-50.png" alt="facebook" width="30" height="30" class="img-fluid" />&nbsp;
                    <img src="images/icons/icons8-instagram-50.png" alt="instagram" width="30" height="30" class="img-fluid" />
                </div>
            </div>
            <div class="row">
                <div class="col text-center">
                    <p class="small">&copy;Copyright 2002-2024 GreenBeaks® Inc. All Rights Reserved<br>
                        This site is powered by&nbsp; <a href="dairyairdesigns.com" class="text-black-50">Dairy Air Designs&reg;</a>
                    </p>
                </div>
            </div>
        </footer>
    </div>

    <script>
        class Dealer extends HTMLElement {
            constructor() {
                super();
            }
            connectedCallback() {
                this.render();
            }
            render() {
                this.innerHTML = `
                    <div class="col">
                        <p><a href="http://mysafebirdstore.com/" class="text-body"><span class="font-weight-bold">${this.getAttribute('title')}</span></a><br>
                            <span class="font-italic">${this.getAttribute('description')}</span><br>
                            ${this.getAttribute('address')}<br />
                            ${this.getAttribute('city')}<br />
                            <a href="tel:7${this.getAttribute('phone')}" class="text-black-50">${this.getAttribute('phone')}</a>
                        </p>
                    </div>
                `;
            }
        }
        window.customElements.define('authorised-dealer', Dealer);
    </script>

 

 

 

Notice:

  • There is just the one container class.
  • All content (with the eception of the navar), is wrapped in a row->col.
  • I have created a custom element called "authorised-dealer" to make the coding a bit easier. The code for the custom element is found at the end of the posted code.
  • I have added a <main> element. This is to help screen readers and search engines to find the main content quickly.

 

As a side note: It is a pity that you are not using the latest version of Bootstrap with all of the hehancements.

Disclaimer: There are still some problems remaining with the styling. If you need assistance correcting these, please come back here.

 

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Mar 22, 2024 Mar 22, 2024

Copy link to clipboard

Copied

I don't know what suggestion the OP implemented in the end to correct the border issue as l haven't looked at the code but this is done and dusted.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 22, 2024 Mar 22, 2024

Copy link to clipboard

Copied

Done and Dusted

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Mar 22, 2024 Mar 22, 2024

Copy link to clipboard

Copied

Well I think that is six of one and half a dozen of the other.....certainly hasnt implemented the Bootstrap recommended html structure..........a mix and match, which I guess is ok, why use more containers than is strictly necessary to position the copyright!

 

Anyway the copyright information has been moved outside of the footer, which you could debate should be the footer technically.......when does something become the footer and when does it not.....should the links even be part of the footer element, should really be wrapped in a <nav></nav> tag inside the footer or maybe not......depends which way you look at it I guess, you pays your money you takes your choice.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Mar 22, 2024 Mar 22, 2024

Copy link to clipboard

Copied

The changes I made were implemented before I had a chance to read the replies. I knew I wasn't doing it correctly, but the outcome looked better. I will do as instructed. I hope I've conveyed how grateful I am for everyone's help. Good thing no one knows greenbeaks.com exists, yet. 🙂

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Mar 22, 2024 Mar 22, 2024

Copy link to clipboard

Copied

quote

The changes I made were implemented before I had a chance to read the replies. I knew I wasn't doing it correctly, but the outcome looked better. I will do as instructed. I hope I've conveyed how grateful I am for everyone's help. Good thing no one knows greenbeaks.com exists, yet. 🙂


By @Haybound

 

You don't need to follow the Bootstrap official way of using a container, a row, col etc for the copyright information.  How you have done it by just using a paragraph tag is perfectly OK, it's less code, why use more when it's not needed. In fact by chance you solved the issue using a common sense approach.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Mar 22, 2024 Mar 22, 2024

Copy link to clipboard

Copied

Thanks, that's nice to hear. When it comes to this stuff, most of my sense is pretty common. 😉

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Mar 23, 2024 Mar 23, 2024

Copy link to clipboard

Copied

I went back to the way I had it the first time. The paragraph tag was temporary, while I tried to recall how I had originally coded it. Not sure if this is correct, either??? Sometimes I can't Bootstrap the way I want it, and end up using the more familiar html.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Mar 24, 2024 Mar 24, 2024

Copy link to clipboard

Copied

quote

I went back to the way I had it the first time. The paragraph tag was temporary, while I tried to recall how I had originally coded it. Not sure if this is correct, either??? Sometimes I can't Bootstrap the way I want it, and end up using the more familiar html.


By @Haybound

 

OK, well it's not a problem, it works. The only issue for me is it uses more containers than is strictly necessary which adds to the management of the code. In my opinion the single <p> tag approach is far better as it is more steamlined. Don't be afraid to break with how Bootstrap advises you should set something up. Yes, in the majority of senarios follow the frameworks default suggestions but let your own common sense tell you when to ignore them.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 24, 2024 Mar 24, 2024

Copy link to clipboard

Copied

quote

OK, well it's not a problem, it works. The only issue for me is it uses more containers than is strictly necessary which adds to the management of the code. In my opinion the single <p> tag approach is far better as it is more steamlined. Don't be afraid to break with how Bootstrap advises you should set something up. Yes, in the majority of senarios follow the frameworks default suggestions but let your own common sense tell you when to ignore them.


By @osgood_

 

You can fool yourself, but please do not pass this foolishness on to others. It is very clear, follow the Bootstrap workflow or follow the highway.

 

Bootstrap layout rules:

 

Containers:

  • they wrap and contain the content
  • provide basic padding and margin to the content
  • centre the content on the page
  • can be fluid, fixed or responsive

 

Bootstrap Grid:

  • containers are wrappers for rows
  • rows are wrappers for columns - only columns may be immediate children
  • columns are wrappers for content - content must be placed within columns only

 

The reason for these rules has to do with (negative) margins and padding.

 

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Mar 25, 2024 Mar 25, 2024

Copy link to clipboard

Copied

quote
quote

OK, well it's not a problem, it works. The only issue for me is it uses more containers than is strictly necessary which adds to the management of the code. In my opinion the single <p> tag approach is far better as it is more steamlined. Don't be afraid to break with how Bootstrap advises you should set something up. Yes, in the majority of senarios follow the frameworks default suggestions but let your own common sense tell you when to ignore them.


By @osgood_

 

You can fool yourself, but please do not pass this foolishness on to others. It is very clear, follow the Bootstrap workflow or follow the highway.

 

Bootstrap layout rules:

 

Containers:

  • they wrap and contain the content
  • provide basic padding and margin to the content
  • centre the content on the page
  • can be fluid, fixed or responsive

 

Bootstrap Grid:

  • containers are wrappers for rows
  • rows are wrappers for columns - only columns may be immediate children
  • columns are wrappers for content - content must be placed within columns only

 

The reason for these rules has to do with (negative) margins and padding.

 


By @BenPleysier

 

You obviously have been fooled, big time and have lost the ability due to age l would assume to do anymore than follow coloring by numbers. Tell me how a  Bootstrap negative margin affects a simple p tag or div tag positioned outside of a Bootstrap containrer. You really are challenged if you think you need a lot of redundant html junk to position a simple centred, one row, one column copyright notice at the foot of a page......l've heard some garbage from you in the past but I think this sinks to new lows If you don't know that much, just shows how religiously following a framework can disrupt common sense. 

 

Deploying unnecessary negative margins is a very poor solution, I rest my case what a pile of horse poo. In the case of Bootstrap yes your absolutely correct.....you can fool some of the people some of the time but not all of the people all of the time, now let me think which of those categories l would place you in.

 

Can l advise you brush up on your html skills a bit if you have time to spare......you're Bootstrap code solution above is very  poor as it doesn't appear to be using a nav tag for what obviously is a navigation. I don't know if that's what Bootstrap advises or if it's your own lack of knowledge.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 25, 2024 Mar 25, 2024

Copy link to clipboard

Copied

quote

Can l advise you brush up on your html skills a bit if you have time to spare......you're Bootstrap code solution above is very  poor as it doesn't appear to be using a nav tag for what obviously is a navigation. I don't know if that's what Bootstrap advises or if it's your own lack of knowledge.


By @osgood_

 

To illustrate the type of manure that you are accusing me of, have a look at the OP's website which currently uses the code above. To help you out, I am referring to line 58.

 

That's all I will say to you on this topic.

 

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Mar 25, 2024 Mar 25, 2024

Copy link to clipboard

Copied

quote
quote

Can l advise you brush up on your html skills a bit if you have time to spare......you're Bootstrap code solution above is very  poor as it doesn't appear to be using a nav tag for what obviously is a navigation. I don't know if that's what Bootstrap advises or if it's your own lack of knowledge.


By @osgood_

 

To illustrate the type of manure that you are accusing me of, have a look at the OP's website which currently uses the code above. To help you out, I am referring to line 58.

 

That's all I will say to you on this topic.

 


By @BenPleysier

 

It's the footer navigation that is troubling me not the navbar top navigation........unless l'm mistaken the code you supplied/posted appears to only be using ul, li tags instead of being wrapped in nav tags. If lm wrong then l apologise, lm having trouble sifting through the bloated code and inline css styling - lm  not near to a device where l can view the code properly.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 25, 2024 Mar 25, 2024

Copy link to clipboard

Copied

quote

It's the footer navigation that is troubling me not the navbar top navigation........unless l'm mistaken the code you supplied/posted appears to only be using ul, li tags instead of being wrapped in nav tags. If lm wrong then l apologise, lm having trouble sifting through the bloated code and inline css styling - lm  not near to a device where l can view the code properly.


By @osgood_

 

Read up on best practice

 

BenPleysier_0-1711364836522.png

 

Where is the inline CSS styling?????

 

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Mar 25, 2024 Mar 25, 2024

Copy link to clipboard

Copied

That in itself is a very unprecise statement, wouldn't you know.  'Major block of navigation links ', well l would consider the block of links in the footer is no less major than the block of links at the top myself , its not just a handful of links to relatively unimportant information. I question that, of  course, but there probably is no difinitive answer, leaving it up to the discretion of the developer like so much.

 

As far as l know using the nav tag is, can be beneficial to those who use assistive technology so l cant think of a good reason not to use the nav tag.........hummm

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 25, 2024 Mar 25, 2024

Copy link to clipboard

Copied

Where is the inline CSS styling?????

 

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Mar 25, 2024 Mar 25, 2024

Copy link to clipboard

Copied

quote

Where is the inline CSS styling?????

 


By @BenPleysier

 

You know what l was referring to, the use of an excessive amount of Bootstrap class names........ugly, making the  html more difficult to read than l would like, a great way to disguise a multitude of sins.

 

Anyway l'm now more interested in what the interpretation of 'major block of links' actually means, intriguing. Without that clarity it's as clear as mud. Laughably, that page shows just 3 links wrapped in a nav tag, is that what they regard as a major block of links, does it refer to the position of the links, the importance of the links.........not sure who makes this s#it up but they obviously don't have a difinitive answer, which is about as helpful as using a chocolate teapot..........more or less, do whatever you want. I'll stick to using nav tags in a more uniformed way rather than throwing things up in the air and letting them fall to ground in a chaotic formation.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 25, 2024 Mar 25, 2024

Copy link to clipboard

Copied

quote

Anyway l'm now more interested in what the interpretation of 'major block of links' actually means, intriguing. Without that clarity it's as clear as mud. Laughably, that page shows just 3 links wrapped in a nav tag, is that what they regard as a major block of links, does it refer to the position of the links, the importance of the links.........not sure who makes this s#it up but they obviously don't have a difinitive answer, which is about as helpful as using a chocolate teapot..........more or less, do whatever you want. I'll stick to using nav tags in a more uniformed way rather than throwing things up in the air and letting them fall to ground in a chaotic formation.


By @osgood_

 

Please start a new discussion. The latest posts are way off topic.

 

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Mar 25, 2024 Mar 25, 2024

Copy link to clipboard

Copied

LATEST

Needing help with my borders is kind of a moot point now, anyway. The new coding has eliminated the borders alltogether. I found this thread difficult to keep up with. But, I think it stopped beng about my borders awhile ago. Thanks to everyone for their time and attention.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Mar 22, 2024 Mar 22, 2024

Copy link to clipboard

Copied

Not sure what this means??? But, I thank you for going beyond; I want to learn. I don't know how to update to Bootstrap 5 in Dreamweaver, and I didn't want to screw it up. 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 22, 2024 Mar 22, 2024

Copy link to clipboard

Copied

The example that I gave you above, is based on Bootstrap v4. If you copy and paste the code in a new document, you will see the result. It is up to you. I have done my best to help you.

 

Oh!. The video is in response to @osgood_ who merrily stated that the problem was done and dusted. In other words that the problem was solved. In actual fact, the problems have just started as you will see as you progress. Thanks to your off-line communications buddy.

 

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines