paulp575
-
Posts
2 -
Joined
-
Last visited
Content Type
Profiles
Forums
Events
Posts posted by paulp575
-
-
I've created an outline button menu following the samples here: How TO - Outline Buttons .
One of the outline buttons needs to have 3 dropdown items. I've reviewed the samples here: How TO - Dropdown Navbar , but am confused if I can add the dropdown function to only one of the outline buttons.
I've attached a screen shot of the effect I'd like to create - except I'd like each item in the dropdown to be a separate outline button. This example is from a CMS we have decided not to use.
Here's the HTML code I'm using to create the web page:
Quote<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Menu Test</title><style>
<!--
*.BTN
{
FONT-SIZE: 16px;
FONT-WEIGHT: bold;
COLOR: #000000; /* Black */
BACKGROUND-COLOR: #33CC00; /* Strong green */
BORDER: 2px solid #000000; /* Black */
BORDER-RADIUS: 25px;
PADDING: 14px 28px;
CURSOR: pointer;
MARGIN: 0px 15px; /* Sets margin for top and right spacing (bottom and left take same values */
}*.BTN:hover
{
BACKGROUND-COLOR: #FFCC66; /* Light orange */
COLOR: #ffffff; /* White */
}*.TEXT-ALIGN-CENTER
{
TEXT-ALIGN: center;
}
-->
</style></head>
<body>
<main class="TEXT-ALIGN-CENTER">
<h1>EWATV Menu</h1><a href="https://ewatv.org/" target="_blank"><button class="BTN">Home</button></a>
<a href="https://ewatv.org/About-Us.htm" target="_blank"><button class="BTN">About Us</button></a>
<a href="https://ewatv.org/Join.htm" target="_blank"><button class="BTN">Join</button></a>
<a href="https://ewatv.org/Resources.htm" target="_blank"><button class="BTN">Resources</button></a>
<a href="https://ewatv.org/Gallery.htm" target="_blank"><button class="BTN">Gallery</button></a>
<a href="https://ewatv.org/Contact.htm" target="_blank"><button class="BTN">Contact EWATV</button></a>
<a href="https://ewatv.org/Donate.htm" target="_blank"><button class="BTN">Donate</button></a><!--
Home
About Us
Join
Resources (dropdown)
Gallery
Contact EWATV
Donate
-->
</main></body>
</html>
Thanks in advance.
How to Add Up/Down Arrows to HTML Table That Can Be Sorted
in CSS
Posted
I am trying to add up/down arrows to an HTML table that can be sorted.
I found the W3Schools example of how to sort a table by clicking on the table headers - https://www.w3schools.com/howto/howto_js_sort_table.asp (second example "Sort Table by Clicking the Headers").
I'd like to add the up/down arrows to the table headers.