The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> HTML review, Need help with my HTML
3LiJvh
post Apr 14 2020, 04:37 PM
Post #1





Group: Members
Posts: 3
Joined: 14-April 20
Member No.: 27,281



EDIT: while writing this post I opened it and it is now showing the images, however they will not show to anyone I send to and the links don't work! So now I'm asking how to make the links work and finally how to make it accessible to anyone I send it to and or a website. As mentioned below I am 2 days old regarding HTML & coding. Hence I have not thought far enough ahead as to how to host it to a web page and or any othe term used to describe making it available to people who recieve this link.


Hello all! I am new to this whole thing, I have vast experience/ knowledge of computers but never actually got into coding until recently. I just started my first project TWO days ago and honestly just jumped right in ninja.gif , that being said I will list my code below; I KNOW that there are many many problems or at the very least easier way to setup- BY ALL MEANS please reply with suggestions and or advice, it is appreciated more than you know smile.gif (preferably not hating on me due to lack of experience).

I know my formatting is incorrect but it works, The reason I am coming here for help is because I need any assistance possible for this reason and this reason solely: I have inserted GIFs onto my page. They were working last night before I added more customizations/headers etc...
My HTML code, using x-code beta as editor:

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://use.typekit.net/dwr8xpc.css">
<style>
@import url("https://use.typekit.net/dwr8xpc.css");

.dropshadowboximg11 {
width:480px;
height:200px;
box-shadow: -5px 5px 5px
#59b300;
}
.dropshadowboximg12 {
width:480px;
height:316px;
box-shadow: 0px 15px 20px
#8cff1a;
}
.dropshadowboximg13 {
width:480px;
height:200px;
box-shadow: 5px 5px 5px
#59b300;
}
.dropshadowboximg21 {
width:558px;
height:678px;
box-shadow: -5px 5px 5px
#59b300;
}
.dropshadowboximg22 {
width:1500px;
height:500px;
box-shadow: 5px 5px 5px
#59b300;
}
.dropshadowboximg23 {
width:558px;
height:678px;
box-shadow: 5px 5px 5px
#59b300;
}

h1 {
font-family: bungee,sans-serif;
font-weight: 800;
font-style: normal;
background-color: #0099ff;
max-width:600px;
margin-right:auto;margin-left:auto;
}

body {
background-image: url('https://coolbackgrounds.io/images/backgrounds/index/compute-ea4c57a4.png');
}
h2{
font-family: bungee, sans-serif;
font-weight: 400;
font-style: normal;
background-color: blueviolet;

}
h3{
background-color: blueviolet

}
h4{
font-family: bungee,sans-serif;
font-weight: 800;
font-style: normal;
background-color: #0099ff;
max-width:1650px;margin-left:auto;margin-right:auto;

}
ul{
font-family: bungee,sans-serif;
font-weight: 500;
font-style: normal;
background-color:
grey;max-height:1450px;max-width:800px;margin-right:auto;margin-left:auto;
}
</style>

<body>
<h1 align="center"><font size="42" face="bungee" color="hotpink"> Jw~9.9.9 BOYZ~wJ </h1>
<div id="banner" style="overflow: hidden; display: flex; justify-content:space-around;">
<div class="dropshadowboximg11" style="max-width: 100%; max-height: 100%;">
<img src ="file:///Users/3lijvh/Pics/999/walkJW.gif" alt="Walking Gesture (Juice WRLD)"></img>
</div>

<div class="dropshadowboximg12" style="max-width: 100%; max-height: 100%;">
<img src ="file:///Users/3lijvh/Pics/999/wowJW999.gif" alt="Music Video Clip (Juice WRLD)"></img>
</div>

<div class="dropshadowboximg13" style="max-width: 100%; max-height: 100%;">
<img src ="/Users/3lijvh/Pics/999/BANG999.gif" alt="Akimbo 'BANG' Gesture (Juice WRLD)"></img>
</div>
</div>

<center><font size="25" face="bungee" color="darkred"><b>
<h2>Useful Links</h2>
</font></center></b>

<ul style="list-style: none;" align='center'>
<font size="10" face="bungee" color="blue"><i><li><a href="https://groovy.bot/commands?prefix=-"><b>Groovy Commands</b></i></a></li></font></i><font size="10" color=black></font><font size="8" color="black"><cite><i>[Groovy Music Bot]</i></cite></font>
<i><font size="10" face="bungee" color="blue"><li><a href="https://dankmemer.lol/commands"><b>DankMemerCommands</b></a></li></font><font size="8" color="black"><cite><i>[DankMemer Bot]</i></cite></font>
<font size="10" face="bungee" color="blue"><li><a href="https://www.pokecord.com/commands"><b>Getting Started -Pokecord</b></a></li></font><font size="8" color="black"><cite><i>[Pokecord Bot]</i></cite></font>
<font size="10" face="bungee" color="blue"><i><li><a href="https://mee6.xyz/"><b>MEE6 Features</b></a></li></font><font size="8" color="black"><cite><i>[MEE6 Bot]</i></cite></font>
<font size="10" face="bungee" color="blue"><li><a href="https://steamcommunity.com/profiles/76561199037161084/"><b>My Steam Profile</b></a></li></font><font size="8" color="black"><cite><i>[Steam]</i></cite></font>
<font size="10" face="bungee" color="blue"><li><a href="https://www.youtube.com/channel/UCCpuK7uAztiuJqT4GiQz0bw"><b>FritzyYT</b></a></li></font><font size="10" color=black></font><font size="8" color="black"><cite><i>[Youtube]</i></cite></font>
</ul>

<h3><div id="banner" style="overflow: hidden; display: flex; justify-content:space-around;">
<div class="dropshadowboximg21" style="max-width: 20%; max-height: 20%;">
<img src ="/Users/3lijvh/Pics/999/Pray999.jpeg" alt="999 Prayer (Juice WRLD)"></img>
</div>

<div class="dropshadowboximg22" style="max-width: 60%; max-height: 100%;">
<img src ="/Users/3lijvh/Pics/999/JWBanner.jpeg" alt="Banner (Juice WRLD)"></img>
</div>

<div class="dropshadowboximg23" style="max-width: 20%; max-height: 20%;">
<img src ="/Users/3lijvh/Pics/999/Pray999.jpeg" alt="999 Prayer (Juice WRLD)"></img>
</div>
</div></h3>
</center>

<h4 align="center"><font size="23" face="bungee" color="hotpink"> "Been Cursed Since Birth, Guess I never Learn..." </font></h4>
<div id="banner" style="overflow: hidden; display: flex; justify-content:space-around;">
<div class="dropshadowboximg11" style="max-width: 100%; max-height: 100%;">
<img src ="file:///Users/3lijvh/Pics/999/walkJW.gif" alt="Walking Gesture (Juice WRLD)"></img>
</div>

<div class="dropshadowboximg12" style="max-width: 100%; max-height: 100%;">
<img src ="file:/Users/3lijvh/Pics/999/wowJW999.gif" alt="Music Video Clip (Juice WRLD)"></img>
</div>

<div class="dropshadowboximg13" style="max-width: 100%; max-height: 100%;">
<img src ="/Users/3lijvh/Pics/999/BANG999.gif" alt="Akimbo 'BANG' Gesture (Juice WRLD)"></img>
</div>
</div>


If my code is confusing do not hesitate to ask questions, I will reply immediately.

Additionally, I have attached an image of what I see when I open the link in a reply below (out of space!)

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
3LiJvh
post Apr 14 2020, 04:43 PM
Post #2





Group: Members
Posts: 3
Joined: 14-April 20
Member No.: 27,281



I guess that I am not savvy enough to figure out why I am unable to attach the screenshot! feel free to ask for it or provide a guide on how!

<b> Just want to emphasize the main issues I'm inquiring about are: (1) make .html document available to people it is sent to & (2) how to make links useable by aforementioned people who are viewing the page. </b>

I am unsure if this matters, but when I drag and drop the file into this reply (attempting to provide the file for the post) it shows as this: "/Users/3lijvh/Desktop/HTML/jw999BOYZ.html"

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Apr 14 2020, 06:07 PM
Post #3


.
********

Group: WDG Moderators
Posts: 8,508
Joined: 10-August 06
Member No.: 7



QUOTE(3LiJvh @ Apr 14 2020, 11:43 PM) *

I guess that I am not savvy enough to figure out why I am unable to attach the screenshot! feel free to ask for it or provide a guide on how!

It's two steps: first upload the image file to the forum, then attach it into your forum post.

There may also be a max limit on how big the can be, but I can't remember the exact size.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
3LiJvh
post Apr 14 2020, 08:27 PM
Post #4





Group: Members
Posts: 3
Joined: 14-April 20
Member No.: 27,281



QUOTE(Christian J @ Apr 14 2020, 07:07 PM) *

QUOTE(3LiJvh @ Apr 14 2020, 11:43 PM) *

I guess that I am not savvy enough to figure out why I am unable to attach the screenshot! feel free to ask for it or provide a guide on how!

It's two steps: first upload the image file to the forum, then attach it into your forum post.

There may also be a max limit on how big the can be, but I can't remember the exact size.


Thank you for filling me in, I attempted to use the "add this attachment" option but no matter what I do the output is "The total filespace required to upload all the attached files is greater than your per post or global limit. Please reduce the number of attachments or the size of the attachments."

The description claims, "global space left 4.88mb" although the attachment shows as being under 800kb! thanks again, I apologize for being incompetent I never really use forums, certainly not as much as I read them!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Apr 15 2020, 04:55 AM
Post #5


.
********

Group: WDG Moderators
Posts: 8,508
Joined: 10-August 06
Member No.: 7



QUOTE(3LiJvh @ Apr 15 2020, 03:27 AM) *

The description claims, "global space left 4.88mb" although the attachment shows as being under 800kb! thanks again, I apologize for being incompetent I never really use forums, certainly not as much as I read them!

It seems max space per post is just 350KB. Tried it myself, this is how it works:

First, click Choose and select the file on your computer. Next, click Add This Attachment to upload it. Below the message textfield, it may say something like:

CODE
foo.PNG    (20.73k)         

You have used 20.73k of attachment space for this post.
You have 329.27k left for this post.

--not sure what happens if the file is too big. unsure.gif Finally click Add into Post to determine where in the post you want the uploaded image to appear (if I don't, it seems the file[s] will still be displayed at the bottom of the post).
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 12th August 2020 - 02:35 AM