We help IT Professionals succeed at work.

HTML

60K

Solutions

31K

Contributors

HTML (HyperText Markup Language) is the main markup language for creating web pages and other information to be displayed in a web browser, providing both the structure and content for what is sent from a web server through the use of tags. The current implementation of the HTML specification is HTML5.

Hi Experts - Does anyone know a way to upload an image within HTML code.  For example:  

<table width="100%"><tr><td><table width="100%"  cellpadding="0" cellspacing="2"><tr bgColor="#006599"><td height="2"></td></tr><tr bgColor="#993399"><td height="3"></td></tr><tr><td><table width="100%" border="0" cellspacing="1" cellpadding="1"><tr><td height="2"></td></tr><tr bgColor="#FFCC33"><td><table width="100%" cellspacing="1" cellpadding="12"><tr><td><b><font face="arial" size="4"><bold>New secure email message from ACME Services Secure Portal</bold></font></b></td></tr></table></td></tr><tr><td height="2"></td></tr></table></td></tr><tr bgColor="#006599"><td height="3"></td></tr><tr bgColor="#993399"><td height="2"></td></tr></table></td></tr></table><img src="/acme.jpg"><table width="100%" cellpadding="10"><tr><td><table bgcolor="#006599" cellspacing="2" cellpadding="4" border="0"><tr bgcolor="#006599"><td><a href="sample" style="text-decoration: none; display:inline-block; cursor: pointer;background-color: ; color: #ffffff; font-family: arial; font-size: 18px; font-weight: bold;text-align: center; text-shadow: 0 -1px 0 #4D4D4D; padding: 12px 16px 12px 16px; border-width: 2px;border-color: #006599;">Open Message</a></td></tr></table></td></tr><tr><td><font face="arial"size="3"><p>To view the secure message, click Open Message.</p><p>The secure message expires on {test date}.</p><p>Do not reply to this notification message; this message was auto-generated by the …
0
I have this datatable but it goes under my footer. Does anyone have a fix? margin or padding dont seem to work.
table-mobile.PNG
0
I wanna use a bootstrap data table but i cant get it to work.
this it the code in my header:
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css">
    <script type="text/javascript"  src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>>

Open in new window


What line do i need to add to get bootstarp datatable since the one i have been using does not seem to work.
0
Hey i want to use datatables for the first time but it is not working:
THis code is in my header:
        <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css/">

        <script type="text/javascript" src="//cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>

Open in new window

And this is the table:
    <table id = "myTable">
        <thead>
            <th>Username</th>
            <th>Result</th>
            <th>Quiz name</th>
            <th>Category</th>
            <th>Date</th>
        </thead>
        <tbody>
            {% for res in result_sql %}
            <tr>
                <td>{{res.username}}</td>
                <td>{{res.result}}</td>
                <td>{{res.quiz_name}}</td>
                <td>{{res.category}}</td>
                <td>{{res.date}}</td>
            </tr>
            {% endfor %}

        </tbody>


    </table>
<script>
$(document).ready( function () {
    $('#myTable').DataTable();
} );
</script>

Open in new window


Can anyone find the problem?
0
Hey i have this table in html which is scrollable vertically. This works but there is an issue the headers do not allign with the text in the table. Does anyone know how i can fix this?
this is the code:
table {
  display: inline-grid;
  grid-template-areas:
  "scrollable";
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}


tbody {
  overflow: auto;
  height: 400px; /* define height depending on your needs */
  width: 100%;
}

Open in new window


And the table is:
   <table>
        <thead>
            <th>Username</th>
            <th>Result</th>
            <th>Quiz name</th>
            <th>Category</th>
            <th>Date</th>
        </thead>
        <tbody>
            {% for res in result_sql %}
            <tr>
                <td>{{res.username}}</td>
                <td>{{res.result}}</td>
                <td>{{res.quiz_name}}</td>
                <td>{{res.category}}</td>
                <td>{{res.date}}</td>
            </tr>
            {% endfor %}

        </tbody>


    </table>

Open in new window


I will also attach a photo of the table if anyone could help that would be great!
table.PNG
0
Dear experts

Please help with scripting below:
$Arr variable got a table created.
$Arr | Select-Object -Property BatchName, TimeStamp, BatchEndedOK, FileMissing | ForEach-Object {
 if (FileMissing -eq true) { 
$a = $a + "<style>"
$a = $a + "BODY{background-color:white;font-family:verdana;font-size:12px;}"
$a = $a + "TABLE{border-width: 1px;border-style: solid;border-color: black;border-collapse: collapse;}"
$a = $a + "TH{border-width: 1px;padding: 0px;border-style: solid;border-color: black;padding:3px;background-color:#0dfc2d}"
$a = $a + "TD{border-width: 1px;padding: 0px;border-style: solid;border-color: black;padding:3px}"
$a = $a + "tr:nth-child(odd) { background-color:#d3d3d3;}" 
$a = $a + "tr:nth-child(even) { background-color:white;}"
$a = $a + "</style>"
$htmlout = $sqlArr | Select "BatchName", "TimeStamp", "BatchEndedOK", "FileMissing" | convertto-html -head $a
}
else {
$htmlout = $sqlArr | Select "BatchName", "TimeStamp", "BatchEndedOK", "FileMissing" | convertto-html -head $a
}
}

Open in new window

$Arr looks like this:
Batchname                                                        TimeStamp                                                                                                           BatchEndedOK                                                     FileMissing
---------                                                                     ---------                                                                                                          …
0
Hello CSS Experts

I need to align 4 columns on a page. Its a shopify site (just a demo) and I have access to the html

Here's the link to the page   https://bit.ly/3aP1w1u

You'll see 4 blue buttons on the page.  They need to be centered and the text under each button should be aligned to the left.

I have attached a mockup of what I am looking for,. Hopefully it helps explain things.  SImple mockup of what I''m looking for
It's a Shopify site (demo) and I have access to the HTML on this page (and of course any necessary CSS that needs to be added.
Thanks
Rowby
0
Can't figure out why the page is loading and defaulting to the form down the page and not just the default top of the screen. I think it's focusing on an input field, but I don't know why, since I'm just adding the TABINDEX capability like all my forms do.

https://wildernessclubmontana.com/events-and-meetings/
0
Experts, we have a batch script that we run on a user's pc to aid in trouble-shooting.  The script echo's out the results to a log file but as we gather more info and put it into the log file, it's becoming a bit lengthy.  If I could put it into an html format, I'd like to be able to jump to different sections by links.  

Any suggestions on how to go about accomplishing this?  Thanks Experts.
0
I have this site with a navigation bar with a dropdown. On the other site i have a select with two values.
This is the dropdown:
         <button class="dropbtn">Login</button>
                    <div class="dropdown-content">
                        <a class = "teacher" href="login">Teacher Login</a>
                        <a class = "student" href="login">Student Login</a>
                    </div>

Open in new window

And this is the select i am using:
    <form class = "login" action="/login" method="post">
        <div class="form-group">
            <select class="form-control" name="role">
                <option disabled selected value="role">Role</option>
                        <option value="teacher">Teacher</option>
                        <option value="student">Student</option>
            </select>

Open in new window

So my question is : how can i  make it that if the user clicks on student login the select will stand on value "student" and the other way around?
The select is on a different page then the login dropdown so that makes it hard for me.
0
I have the following codes to just loop inside of the html form and get the field name and value
it works as long as it is <input type=text>
I have textarea now inside of the form and do not know how to make it works.

Can you help? I tried to 'type' but it shows undefined.



function SubmitAPI(apiurl_value, stagecompleted_value, successmsg_value, emailsubject_value, emailaddress_value, emaildestination_value) {
    var x = $('#formdiv *').serializeArray();
    var data = {};
    var apiurl = apiurl_value;
    var stagecompleted = stagecompleted_value;
    var successmsg = successmsg_value;
    var emailsubject = emailsubject_value;
    $.each(x, function (i, field) {
        data[field.name] = field.value;
    });
    var jsondata = JSON.stringify(data);
    $.ajax({
        url: apiurl,
        type: "POST",
        data: { 'message': jsondata.replace(/\"/g, "'"), 'email': emailaddress_value, 'emailsubject': emailsubject, 'emaildestination': emaildestination_value },
        dataType: 'json',
        success: function (data) {
            if (data.stage === stagecompleted) {
                alert(successmsg);
                document.location.reload();
            }
        },
        error: function (msg) { alert(msg); }
    });
    return false;
}

Open in new window

0
Trying to get a div to slide in from the left and stick to the bottom of the page, after a 4 second delay on page load.

The div appears on page load, no delay, or slide-in effect.

html
<div id="slidebox" class="show modal">
    <!-- ACF ad url here -->
    <a href="#">
    <!-- ACF img here -->
        <img src="https://upload.wikimedia.org/wikipedia/commons/2/24/Ad-MediumRectangle-300x250.jpg" alt="-ad" width="300" height="250">
    </a>
</div><!-- /.slidebox -->

Open in new window


CSS
#slidebox.show {
  left: 0;
  -webkit-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
}
#slidebox {
  max-width: 300px;
  background-color: #fff;
  position: fixed;
  bottom: 0;
  left: -430px;
  z-index: 10;
  -webkit-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
}

.show {
  display: block;
}

Open in new window



js
jQuery(document).ready(function($) {
  setTimeout(function() {
    $('#slidebox').delay(4000).fadeIn(500);
  }, 4000); // milliseconds. set to 10 seconds.
});

Open in new window

0
Hi,
I start by saying this is the first project I have ever published and apologize in advance if I give you too much or too little information.
So, I published this MVC project to a business server.  It works but the data in the datatable is not showing. Although, when I just debug in Visual Studio there is data.
This project has 2 tabs:  
The first tab is to show the datatable in question which uses Entity Framework;  
The second tab also has a datatable(a yadcf) which shows data that is accessed via Ado.Net.
Data in the first tab does not show, while it does in the second tab.  


The datatable on the first tab references to this link:
 <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.js"></script>

While for the second tab I imported the yadcf datatable. Below is how I reference to it:
<script src="~/Yadcf/jquery.dataTables.yadcf.js"></script>  


Also, when I do F12 under the "Elements" I can see the references to the datatables(see attached photo).  Plus it looks like the datatable and its functionalities(search box, paging, column names) show up but without any data in it.


IN CASE YOU WANT TO SEE IT, THIS IS THE CODE OF THE INDEX PAGE WHICH INCLUDES THE DATATABLE:
`
@{
    ViewBag.Title = "Index";
}

<ul class="nav nav-tabs">
    <li class="active"><a data-toggle="tab" href="#firstTab">View All</a></li>
    <li><a data-toggle="tab" href="#secondTab">Add New</a></li>
  

Open in new window

0
Hello experts.  I am having some trouble running one of the group projects we created in our bootcamp.  If I may, describe the issue and can you recommend which additional files to attach to help with the detective work?

This was a working project that we presented(it was on a different laptop than mine).  I pulled it down from Github onto my laptop.  I worked through a few roadblocks and I do have it running on my localhost. Unfortunately, the html page that is loaded is blank.  When I open the html file in a Sublime  there is no markup in it.  I attached the index.html file.  There are comments in it I do not understand.  I was responsible for the backend while another team member took care of the frontend

1)
Here is what I have in the server.js file for the html page:

app.get(function(req, res) {
   res.sendFile(path.join(__dirname, "./client/public/index.html"));
});

2)
I attached a screen print of the browser console when the index.html file opens empty.







Thank you for your patience and help,
Ed
0
Hi
From the articles I've read, and my experience so far, I'm going to use brackets to code my phone games.
As it is now, I'm doing them in one .html file, like in the Udemy / phaser examples, which were all v.good.
Someone said that he prefers to click out and load the project in his browser than use the brackets runtime. I was glad someone else does the same.


However, - How should I code my game, in anticipating transferal to stores/devices? If I run the html (webserver-served) in my iPhone, the javascript game appears perfectly, except for tiny size issues and vertical/horizontal, which is all me. If I can do it in my phone in html, is that where I need to be to publish it in an app store!?
? Slither runs in a browser. Is that javascript loaded from the html, or coded in the html?

Below is an example page that I related to nicely on the phaser examples for my first game.
Should I put that html code in a .js file? from the <script> above the Config down to the </script> ?
Do I put the <script> tags in the .js file, or not? and do <script src = "..."> to load it in?
What does the js and enclosing index.html file look like for that?

We can ignore the preload, so we don't have to bother with the background file, or put in a pic of your cat!

here

Thanks
0
Hi Experts,

My new client gave me the attached PDF post as content and I am wondering how would someone do it?

If I take a snapshot and save it as image, it is too blurry.

If I use a PDF to HTML online converter I get a lot of symbols like ~~0 instead of the percents

I tried the PDF Embedder, but I get Setting up fake worker failed: "Cannot read property 'WorkerMessageHandler' of undefined".

The best was the converter, and I go line by line and edit the symbols, but the HTML is not in order as they use absolute positioning. I can do it, but I cannot help wonder if this is the proper way or if there is a better way.finra-infographic---the-financial-ch.pdf
0
Hi,

I am creating an email signature in HTML so I can share with my colleagues. I want them to be able to copy and paste into Outlook and change name.
The issues:

1. images dont copy into Mac Outlook
2. If I convert images to Base64, when you paste into outlook they resize themselves to massive.
3. If I resize the images to 30x30 in photoshop, they dont look that crisp.
4. Adding CSS width height doesn't seem to change anything

Code:

<table width="320" style="font-family: Helvetica Neue,Helvetica,Arial,sans-serif;" cellspacing="0" cellpadding="0" border="0">
    <tbody>
        <tr>
            <td width="100%" style="font-size: 15px;line-height: 1.4;color:#37393a">
                <strong>Name Name</strong> <br/>
                <span style="color:#006eb6;">Position Position</span> <br/>
                <span style="color:#006eb6;">&#8212;</span>
                <br/><br/>
            </td>
        </tr>
        <tr>
            <td style="font-size: 15px;font-weight: bold;line-height: 1.4;color:#37393a">
                <span style="color:#006eb6;">T &nbsp;</span> +44 (0)00 <br/>
                <span style="color:#006eb6;;">D &nbsp;</span> +44 (0)00
                <br/><br/>
            </td>
        </tr>
        <tr>
            <td style="font-size: 15px;font-weight: bold;line-height: 1.4;color:#37393a">
                <a href="" style="color:#006eb6;text-decoration:none;"><span style="color:#006eb6;text-decoration:none;">aaa.com</span></a>
     

Open in new window

0
I am sending meeting invites to people outside my organization

And whenvthey open it says .dat file

I see my outlook is configured to have html format compose message

Do I need to check anything on receiver end
0
Hi JavaScript Experts,

I’m trialing some code to make it so HTML <select multiple> controls don’t need Ctrl to be held down while clicking, to select/deselect options without deselecting all other selected options.  I picked up this solution from the JSFiddle in the accepted solution from here.

I don’t know much JavaScript, but I guessed how to change that JSFiddle so it respected disabled options, by simply adding a condition, and here’s the resulting JSFiddle including that change.

Now I’m wanting to see if I could have a plain JavaScript (i.e. without jQuery) version of that, so I can compare performance, because I don’t (yet) need jQuery for anything else in my Perl web application and if a plain JavaScript version works out to be lighter, I’ll use it, because page load speed is important for this light application.  I know jQuery caches, but it will reload during refreshes.  So could someone please convert it for me?  If it's going to be too long/hard to convert while retaining a good level of browser compatibility, let me know.

Also, the code seems to work on Firefox, Chrome, Opera, Edge, but not IE11 for some reason (i.e. Ctrl click is still required).  Any ideas why or how to fix that?  If not, I’m not too worried, because I hear IE’s days are numbered.

Here's the code for your convenience:

Open in new window

0
Doe anyone here have any suggestions as to how I might add some kind of transition (ie: fade in/fade out effect) when hovering over the large horizontal images on this page (ie: Mosaic, Panorama, Watercolor, Indian Springs, The Ranches):

https://rgc.touchstoneliving.com/

Here is the CSS that I have currently.  How might I adapt this?  

.mosaic-bg > div:hover {
    background-image: linear-gradient(rgba(44, 38, 108, 0), rgba(44, 38, 108, 0)), url('images/mosaic-bg.jpg');
    cursor: pointer;
}

.panorama-bg > div {
    background-image: linear-gradient(rgba(227, 171, 53, .6), rgba(227, 171, 53, .6)), url('images/panorama-bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.panorama-bg > div:hover {
    background-image: linear-gradient(rgba(44, 38, 108, 0), rgba(44, 38, 108, 0)), url('images/panorama-bg.jpg');
    cursor: pointer;
}

.watercolor-bg > div {
    background-image: linear-gradient(rgba(0, 90, 156, .6), rgba(0, 90, 156, .6)), url('images/watercolor-bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.watercolor-bg > div:hover {
    background-image: linear-gradient(rgba(0, 90, 156, 0), rgba(0, 90, 156, 0)), url('images/watercolor-bg.jpg');
    cursor: pointer;
}

.indiansprings-bg > div {
    background-image: linear-gradient(rgba(189, 52, 36, .6), rgba(189, 52, 36, .6)), url('images/indian-springs-bg.jpg');
    background-size: cover;
    

Open in new window

0
http://www.mediascrubber.com/index.html

The webpage is cutting off the R and the Y on Mac Computers.  Happens in both Chrome and Safari.  Any help is appreciated.  Yje page size is 1920 X 900 px  I can resize the browser window  with a PC and the page resizes accordingly but not on a mac.
0
Copy HTML to Word does not display the pictures



I am copying HTML page to MS Word 2013, but the picture location shows just the frame
Thank you


h
the settings on Word :
w
0
Hi guys,

I want to add a video instead of the 3 images here on the slider http://88.202.183.16/~lcseating/ to a video thats attached but keep the overlay that is going over the image at the moment to overlay the video, is that possible?
Video.mp4
0
I am currently building a site that uses this template. http://themes.potenzaglobalsolutions.com/html/webster-responsive-multi-purpose-html5-template/service-04.html

The element I am stuck on is a little more than halfway down the page where is says, "Lets get started with the Webster!"
I really like the feature of having two full width images with text and calls to action like that. The only problem is the way the images are behaving.

Rather than always remaining the same height and getting cropped as the viewport size decreases, I would like the image to always be 100% width and have the height resize proportionately.

I understand that very quickly, perhaps as soon as md or even lg size, the height of the text in the div next to it will exceed the height of the image, so at that media query, I'd like it to be replaced with a different image I will create that is a less wide rectangle.

Then once it hits the sm size, it's fine for the images to be hidden as they currently are.

This question assumes that the answerer is viewing the site on an xl viewport size to begin with, as I would assume most desktop and laptop computers are.

Is this too complicated for a single question?
0
Hi Experts,

I am using a macro to fill values in an online Challan form. Everything is running fine except in the case of  frmTax.Item("ModeOfPay")
I am using the following macro (part of the bigger macro) to select the "Mode of Payment" and then select the Bank Name from the drop down.
Bank Name is already derived in Cell D17 via formula. The list of bank names has been copied from the Web page source.

    Set opt = frmTax.Item("ModeOfPay")
        Select Case ws1.Range("E18")
        Case 1
            opt.Item(0).Checked = True
        Case 2
            opt.Item(1).Checked = True
    End Select
    For drop = 0 To frmTax.Item("NetBankName_c").Length - 1
        frmTax.Item("NetBankName_c").Options.selectedindex = drop
        If LCase(frmTax.Item("NetBankName_c").Options(drop).FirstChild.Data) = LCase(ws1.Range("D17").Value) Then
            Exit For
        End If
    Next

Open in new window


When I click "Proceed", I am getting an alert message to "Select Bank Name" again, even though the correct value is shown as selected in the box.
Only when I select some other value and then reselect the old Value again from the drop down box, the form is allowed to proceed.

The code is selecting ITNS 281 on the following web page
https://onlineservices.tin.egov-nsdl.com/etaxnew/tdsnontds.jsp

I have attached an image of the alert message
Also an excel file containing list of bank names, from which the bank name is selected.
Alert.bmp
Bank-Name-List.xlsx
0

HTML

60K

Solutions

31K

Contributors

HTML (HyperText Markup Language) is the main markup language for creating web pages and other information to be displayed in a web browser, providing both the structure and content for what is sent from a web server through the use of tags. The current implementation of the HTML specification is HTML5.