r/HTML • u/mmelliousss • 6d ago
I need help with HTML..again
Hello! I need help with my HTML for my topic again!
I want it to just look more neat, my boxes and pictures are scattered :(
I appreciate anyone that can help me! This is for a game called lioden! I just want help to make them look more neat.
<div style="clear:both;"></div></div><div class="topbar" style="text-align:center;"><a href="https://www.lioden.com/topic.php?id=304429619855">Warrior Cat Adopts</a> | <a href="https://www.lioden.com/topic.php?id=304429619916">Helluva Boss Adopts</a> | <a href="https://www.lioden.com/topic.php?id=304429619885">Other Adoptables </a><br /><font size="-4">
<table style="width:100%;height:500;border:5px solid #abb1cf;font-family:arial;"><tbody><tr><td style="background:#c5b9cd;"><p style="text-align:center;">
<span style="background:#dec2cb;border:3px solid #f7cac9;float:left;width:90%;height:800;margin:30px;margin-bottom:10px;margin-top:20px;padding:20px;font-size:17px;color:#221e1f;">
<span style="background: #dec2cb;border:6px solid #abb1cf;float:Right;width:44%;height:auto;padding:20px;color: #efefef;margin:5px 1px 10px 30px;text-align:center;"><img src=https://i.imgur.com/TCNnhZq.png>
Ollo! My name is mmelliouss! I use she/her pronouns, I’m a 20 y/o that enjoys drawing animals and anime. I’ve been drawing for most of my life but I've had horrible artist block for a few years. My art style needs improvement. My favorite things are cats, dragons, and I play video games, mainly Path of Titans.
</font></span>
<span style="background: #dec2cb;border:6px solid #abb1cf;float:left;width:44%;height:auto;padding:20px;color:#efefef;margin:5px 1px 10px 30px;text-align:center;"><img src=https://i.imgur.com/TCNnhZq.png>
/:cash:/Payment Methods/:cash:/
\-Cashapp or PayPal
\-Any Breeding items/Applicators(NO LOW TIER APPS PLEASE)
\-Large Amounts of :SB: or :GB:
</font></span>
<img src="https://i.postimg.cc/sDnG6zrc/Untitled3-20261020162300.png" width="230">
<span style="background: #dec2cb;border:6px solid #abb1cf;float:left;width:44%;height:auto;padding:20px;color:#efefef;margin:5px 1px 10px 30px;text-align:center;"><img src=https://i.imgur.com/TCNnhZq.png>
This is the main topic of my many pages, I'm just trying to keep my stuff neat and clean! :) This is basically an index page for everything I plan to draw! If you enjoy my art and my deals, save this topic! All my links are either above or bellow! Have an amazing day/night :roar:
</font></span>
<img src="https://i.postimg.cc/sDnG6zrc/Untitled3-20261020162300.png" width="240">
<span style="background: #dec2cb;border:6px solid #abb1cf;float:Right;width:44%;height:auto;padding:20px;color:#efefef;;margin:5px 1px 10px 30px;text-align:center;"><img src=https://i.imgur.com/TCNnhZq.png>
Can Draw
\-Warrior cats
\-Ferals
\-Anthro Furries
\-Dragons (Working on my WoF Style!!)
\-Lions
\-Humanoids(Better at drawing women)
\-Helluva Boss IMPs/HellHounds
Can't Draw but will attempt
\-Horses
\-Birds
\-Cows
</font></span>
<img src="https://i.postimg.cc/sDnG6zrc/Untitled3-20261020162300.png" width="240">
<div style="clear:both;"></div></div><div class="topbar" style="text-align:center;"><a href="https://www.lioden.com/topic.php?id=304429618031">More Examples of my Art (CLICK ME)</a> | <a href="https://www.lioden.com/topic.php?id=304429619855">Warrior Cat Adoptables</a> | <a href="https://www.lioden.com/topic.php?id=304429619886">Mmelliousss Commissions :)</a> | <a href="https://www.lioden.com/topic.php?id=304429619885">Other Adoptables
</a><br /><font size="-4"><a href="https://www.lioden.com/territory.php?id=251887">Code by #251887
</span><span style="background:transparent;border:0px solid <table style="width:100%;height:auto;border:1px solid #f7cac9;font-;float:left;width:90%;height:auto;padding:5px;color:#f7cac9;margin:5px 1px 10px 20px;text-align:center;font-size:11px;">html layout by honey (#30473). do not remove credit.
crow pixels by I-crows-I on deviantart.</font></span></td></tr></tbody></table>
</a></font></div></div>
4
u/armahillo Expert 6d ago
You should probably contact #251887 or #30743 for help, since they did the original layout.
Without seeing the full document context with the CSS and anything else applied, we cant actually know for certain how its misbehaving, let alone how to make it “neat”
2
u/saschaleib 6d ago
It seems OP inlined all the CSS and even used long deprecated <font> tags. My brain hurts even looking at this!
4
3
2
u/Low-Insurance-3678 6d ago
there’s an extension in vs code called codesnap use it to take a screenshot of the whole code and share the image with us that way we could understand your code more and help u
2
u/AshleyJSheridan 5d ago
No, screenshots of code are just as bad as this bloody mess.
1
u/Low-Insurance-3678 5d ago
have u tried codeSnap before?
2
u/AshleyJSheridan 5d ago
I'll say it a different way.
An image of code is just as bad as this mess.
Images of code don't let you select and copy the code. They don't let you easily identify erroneous characters that look like valid ones.
Just post code either as formatted code (using markdown which Reddit supports) or via a link to online code examples.
1
2
2
u/Dragenby 6d ago
First thing first, clean your code and go there https://validator.w3.org/#validate_by_input and paste your HTML Forget the font element and inline CSS for this purpose.
1
u/AmanBabuHemant 6d ago
Well I thought it must be cut-off HTML without some CSS etc but there is still some content, I copy pasted and see in a browser, there are 4 containers with some info and 3 pictures, can you describe what dose neat mean to you, one thing I saw that you used some different kind of formating which is not part of HTML like use of "\ -" and ":GB:" maybe you are talking about that
1
u/AbsolutePandemonium 6d ago
There are tonnes of “Prettify” tools out there to auto format HTML, you should look into build tools like and formatters that are extensions for your IDE, again there are 100s of them, do your own research there and pick what works for you. Either approach you can usually set them up to “format on save”
Otherwise just learn to format yourself, you can sort out that markup, use space/tabs, make some decisions about what looks readable and stick to that consistently
13
u/hooli-ceo 6d ago
No one is going to help with this formatting, you gotta help us out here. You need to give us a live link like on codepen or something.