Artifacts Gallery Guilds Search Wiki Login Register

Welcome, Guest. Please login or register. - Thinking of joining?
a Summer day - @455.88
Activity rating: Three Stars Posts & Arts: 25/1k.beats Random | Recent Posts | Guild Recents
News: :ha: :pc: Hello Melonland! :pc: :happy: Guild Events: There are no events!

+  MelonLand Forum
|-+  Projects & Art
| |-+  ☆ ∙ Web Projects
| | |-+  Finally built a custom layout!


« previous next »
Pages: [1] Print Embed
Author Topic: Finally built a custom layout!  (Read 2394 times)
night-at-the-musian
Full Member ⚓︎
***
View Profile WWW


Rule 1: Throw the bone!
⛺︎ My Room

Artifacts:
Great Posts PacmanFirst 1000 Members!Joined 2023!
« on: a Winter night » Embed

It took me a while to get the main pages done (university workload has been insane), but I finally put together a custom layout for my fan site! W3schools is a gift to this earth for all the help they've given me. Still updating the deeper pages, but the surface pages are all set. I'm going for a simple, professional vibe, easy to read and navigate.

Check it out!! And say hi if you want :grin:

Logged

Tiny Roman Appreciator
https://64.media.tumblr.com/e75f3a79b14a83e54eb6f7f1ab25ff3a/dba2cb98fcee4779-be/s540x810/d0b8bea1cb4705f18506276eb8ea8e0c867035d8.gifv
https://64.media.tumblr.com/c3f37b2d1e429e31b0d0f8aa325b9f93/a57fceeda9c695c6-60/s100x200/a2ac79f74428424ec8cb94808e46c9c30f5e5288.gifv
cyberfun1 (dizz)
Hero Member ⚓︎
*****
View Profile WWWArt


I dont🧠dat evrythngs a lie, as long as u ♡me 4evr
⛺︎ My Room
Matrix: Chat!
XMPP: Chat!

Guild Memberships:
Artifacts:
Wishing you Happy Times when you're online!20% coolerFirst 1000 Members!Joined 2023!
« Reply #1 on: a Winter night » Embed

Yk i gotta ask, why do you like NatM so much? I mean there are some amazing movies out there, but why NatM specifically?  :dunno:
Like, i never even knew there was a search engine specifically for NatM related stuff until now, and its because of you being here. Why oh why do you love this darn movie  :wink:

Logged

https://diffydude.neocities.org/blinkies/FRIENDSHIPISMAGIC.png
https://diffydude.neocities.org/blinkies/TAPEHERO.png
https://diffydude.neocities.org/blinkies/EMOTICONUSER.gif
https://diffydude.neocities.org/blinkies/XBOX360.png
https://diffydude.neocities.org/blinkies/FIREFOXUSER.jpg
https://diffydude.neocities.org/blinkies/NYANCAT.gif
https://diffydude.neocities.org/blinkies/BISEXUAL.png

Artifact Swap: I met Dan Q on Melonland!
night-at-the-musian
Full Member ⚓︎
***
View Profile WWW


Rule 1: Throw the bone!
⛺︎ My Room

Artifacts:
Great Posts PacmanFirst 1000 Members!Joined 2023!
« Reply #2 on: a Winter night » Embed

Yk i gotta ask, why do you like NatM so much? I mean there are some amazing movies out there, but why NatM specifically?  :dunno:
Like, i never even knew there was a search engine specifically for NatM related stuff until now, and its because of you being here. Why oh why do you love this darn movie  :wink:

Nostalgia hit me like a bus while I was helping my parents move about a year ago. I watched the original trilogy, and then later in 2022 the animated one came out, and news of the musical was spread. This was also the time where I was honing my skills in university for professional archivism; and seeing as how there was SO LITTLE PRESERVATION for such an influential franchise, I said "heck with it" and started saving stuff! A year or so later and here we are. Doesn't help that Robin Williams was the only celebrity I gave a shit about as a child (Aladdin, Flubber, Mrs. Doubtfire).

Also, I'm a man who can appreciate Owen Wilson. Mr Wow-Kachow has given me brain worms.

Logged

Tiny Roman Appreciator
https://64.media.tumblr.com/e75f3a79b14a83e54eb6f7f1ab25ff3a/dba2cb98fcee4779-be/s540x810/d0b8bea1cb4705f18506276eb8ea8e0c867035d8.gifv
https://64.media.tumblr.com/c3f37b2d1e429e31b0d0f8aa325b9f93/a57fceeda9c695c6-60/s100x200/a2ac79f74428424ec8cb94808e46c9c30f5e5288.gifv
xero333
Full Member
***
View Profile


⛺︎ My Room
StatusCafe: xero333
iMood: xero333
XMPP: Chat!

Artifacts:
Joined 2024!
« Reply #3 on: a Winter day » Embed

It took me a while to get the main pages done (university workload has been insane), but I finally put together a custom layout for my fan site! W3schools is a gift to this earth for all the help they've given me. Still updating the deeper pages, but the surface pages are all set. I'm going for a simple, professional vibe, easy to read and navigate.

Check it out!! And say hi if you want :grin:


Hey. Hope you don't mind but I had a look at your site and noticed one of your headings was overflowing in the left section and some of your other elements were off the screen. I just had a play around with the inspector tool and a few small changes have really helped. You can set the sidebar class, header, and grid containers' max-width property to 100% (max-width: 100% for each of these element in your CSS). This has brought the missing content back onto the screen. Just my suggestions, feel free to ignore! :)

Logged

:pc: Bring back the old web! :pc:
night-at-the-musian
Full Member ⚓︎
***
View Profile WWW


Rule 1: Throw the bone!
⛺︎ My Room

Artifacts:
Great Posts PacmanFirst 1000 Members!Joined 2023!
« Reply #4 on: a Winter night » Embed

Hey. Hope you don't mind but I had a look at your site and noticed one of your headings was overflowing in the left section and some of your other elements were off the screen. I just had a play around with the inspector tool and a few small changes have really helped. You can set the sidebar class, header, and grid containers' max-width property to 100% (max-width: 100% for each of these element in your CSS). This has brought the missing content back onto the screen. Just my suggestions, feel free to ignore! :)

Thanks for pointing that out!! I built the site with my laptop's screen in mind; I'll update the CSS as soon as I can. c:

Logged

Tiny Roman Appreciator
https://64.media.tumblr.com/e75f3a79b14a83e54eb6f7f1ab25ff3a/dba2cb98fcee4779-be/s540x810/d0b8bea1cb4705f18506276eb8ea8e0c867035d8.gifv
https://64.media.tumblr.com/c3f37b2d1e429e31b0d0f8aa325b9f93/a57fceeda9c695c6-60/s100x200/a2ac79f74428424ec8cb94808e46c9c30f5e5288.gifv
starbreaker
Hero Member ⚓︎
*****
View Profile WWW


What good is Heaven if we dare not storm it?
⛺︎ My Room
StatusCafe: starbreaker
RSS: RSS

Artifacts:
Visited on Melon's 10th Anniversary!Great Posts PacmanFirst 1000 Members!G4 Club Member!Joined 2023!
« Reply #5 on: a Winter night » Embed

Nice job so far! I have a few suggestions that might be of use to you. If not, discard them.

  • Instead of using <div> with classes, it might be worthwhile to use some of HTML5's dedicated tags.
    • <div class="header"> could be <header>
    • <div class="footer"> could be <footer>
    • <div class="sidebar"> could be <nav> (since your navigation is there)
    • <div class="menu"> could be <main> (since your main content is here)
    • <div class="imagezone"> could be <aside> (since it contains additional content but isn't navigation)
    The main benefit to using the dedicated tags is that browsers can easily identify what each part of a page does, which makes them more accessible to people using screen readers. Also, if your main content is in <main> it'll show up when activating the browser's reader mode.
  • If you arrange your page in this order: header, nav, main, aside, and footer, then you've got a mobile-friendly layout by default. If you put your grid layout inside a CSS media query like "@media only screen and (pointer: fine)" you can keep your site mobile-friendly and provide your 3-column layout for laptop and desktop screens. This will also make it easier to make your website printer-friendly. :)
  • Instead of a six-column grid, maybe five columns (menu main main main right) will give your menu and sidebar a little more room while still leaving plenty of room for your main content.
  • You don't have to set the widths of elements inside the .grid-container with inline styles. CSS Grid will take care of layout; that's what it's for.

« Last Edit: a Winter night by starbreaker » Logged

https://starbreaker.org/assets/buttons/starbreaker-88x31.avif

as all kingdoms fall, let my will be done on earth, and heaven be damned
night-at-the-musian
Full Member ⚓︎
***
View Profile WWW


Rule 1: Throw the bone!
⛺︎ My Room

Artifacts:
Great Posts PacmanFirst 1000 Members!Joined 2023!
« Reply #6 on: a Winter night » Embed

Instead of a six-column grid, maybe five columns (menu main main main right) will give your menu and sidebar a little more room while still leaving plenty of room for your main content.

I'll test that out on some of the newer pages being built! I appreciate your suggestions :4u:

Logged

Tiny Roman Appreciator
https://64.media.tumblr.com/e75f3a79b14a83e54eb6f7f1ab25ff3a/dba2cb98fcee4779-be/s540x810/d0b8bea1cb4705f18506276eb8ea8e0c867035d8.gifv
https://64.media.tumblr.com/c3f37b2d1e429e31b0d0f8aa325b9f93/a57fceeda9c695c6-60/s100x200/a2ac79f74428424ec8cb94808e46c9c30f5e5288.gifv
Pages: [1] Print Embed 
« previous next »
 

Melonking.Net © Always and ever was! SMF 2.0.19 | SMF © 2021 | Privacy Notice | Send Feedback | Supporters ♥ Forum Guide | Rules | RSS | WAP | Mobile


MelonLand Badges and Other Melon Sites!

MelonLand Project! Visit the MelonLand Forum! Support the Forum
Visit Melonking.Net! Visit the Gif Gallery! Pixel Sea TamaNOTchi
@000 MelonLand Editor Recent Edits Tenement Arcade Want to Login or Join ? Forum Art Hub Chat Webring Web Guides Graphics Catalogue Wiki Newsletters Image Stream
Melon's Sites TamaNotchi Textures PixelSea GifyPet MoMG Ozwomp Online Loom Videos Leaky Webring Melonking
Tools Melon Software ArtHub Embed Maker ML Passports
Outlinks Frutiger Aero Forum Onio Club m15o's Web Services 32Bit Cafe iMood Webrings Internet Phone Book HTML Energy Declarations Hackers & Designers
Zap!
Minecraft: Online
Join: craft.melonking.net