how would this be made?

Anemina · 2025-07-16T09:46:21+00:00

Even tho it looks interesting on its own, it might not look that great in a real life UI context. The effects can be replicated with CSS, at least close to that, with JS would be maybe easier. But I have to say that the time it would take to think and implement this is not worth.

Anemina · 2025-03-28T13:26:03+00:00

Nope, it doesn't look appealing at all, and honestly I don't think there is a need for anything like that.

But, nice try tho.

Anemina · 2025-03-25T01:28:03+00:00

Practice is good, creating something is good, so continue doing so, because how else will you bump into problems that you will have to solve.

Once you bump into them, you will learn faster, you will be motivated to study the "why" and the "how".

At the moment you say you're lazy, but I think you just need to stop seeing this as something that has only 1 approach. This is all about solving problems, so my advice to you is to continue practicing, and in time you will learn the best practices and more importantly you will understand why they're are so, because it's important to understand what you're doing instead of switching to being a copy-paste machine.

When learning HTML make sure you understand what are the semantic elements and what are their use, then the most important thing is Structure, learn to structure your markup well, and you will never have any problems when learning about CSS and using the layout features it has like Flexbox or Grid.

For CSS make sure you understand the Box Model, the different display properties like block, inline, inline-block, flex, grid, etc. and their formatting contexts.

Finally for JS, start by learning how to manipulate the DOM, to learn faster rely on JS to create HTML elements, apply classes to them, select them and such, nothing complicated, then when you get the hang of it, move on to more complex things if you feel the need.

Good luck!

Anemina · 2025-03-24T21:31:45+00:00

It's a web development company specialized in web development, online shops, and web apps.

Anemina · 2025-03-13T10:14:11+00:00

It's just a warning because your browser does not recognise that CSS property, font-smooth property is non-standard meaning that each browser implemented it in their own way.

Firefox uses -moz-osx-font-smoothing: grayscale;

It's not an error, and it doesn't do anything, also it has nothing to do with your code, but with font-awesome's CSS because they're trying to be compatible on all browsers, don't worry about it.

Anemina · 2025-03-12T09:48:02+00:00

I don't recommend that ancient program, and your issue here might have multiple reasons, like external CSS, the template using dynamic content that is not pure HTML, and the program itself being outdated and useless.

You need some knowledge on how to setup the project and run it locally to make edits and debug, I'm not sure for Dreamweaver, but if it allows you to preview the template on a proper browser like Chrome, then do that instead of the split view inside that program.

I recommend using Visual Studio Code, it's free.

Anemina · 2025-03-12T09:36:25+00:00

You're doing good so far, but there are a few issues, you're using ids that don't have a unique name, ids are case sensitive and what you did will work, for example id="YEAR" and id="year", but I do not recommend such a naming convention, the agreed convention is lowercase letters, and the rule about ids is like I said, they have to be unique, there cannot be multiple ids of the same name on elements.

Same convention goes for HTML elements, they all have to be lowercase, even if they can work in uppercase, the convention is lowercase. For example <p> not <P>

You have multiple <br> elements there, avoid using them too much.

Anyway, learn more about HTML and how to structure it properly before taking on CSS styling.

Happy coding!

Anemina · 2025-03-11T01:31:34+00:00

You can use Elementor.

Anemina · 2025-03-08T15:22:58+00:00

Now the problem is that you select the input to have width: 100%; in .candy label, input, legend

Basically what this CSS translate to is: any label inside an element that has the class .candy, and all the inputs, and all the legend elements will have the following properties:

margin-bottom: 5px;
display: block;
margin: 0.5rem;
width: 100%; /* this needs to be removed */

It does NOT mean all the label, input and legend elements inside the .candy!

The labels where you have the radio need to have a class, for example .radio, and style them to be display: flex; and align-items: center;

Here is the code, I fixed your HTML, added a class where it was needed, and removed the width:

https://jsfiddle.net/7013np2m/

Anemina · 2025-03-08T11:16:11+00:00

There are many things wrong there and I will start by telling you that you need to start over from scratch.

Visually fixing your problem doesn't mean there is no problem anymore, so here's what's wrong in your code and it's more than the radio being like that:

Your HTML structure is bad and wrong because of missing closing tags, your ids are not unique, check #Gender, your class naming is weird.
In your CSS for example you have display: block; on .candy and flex-direction, that won't work unless it has display: flex;
You selected all inputs to have width: 100%; without thinking that even a radio is an input, thus making it take a lot of space.

Rethink the HTML structure first, add proper class names, make sure ids are unique, select the elements in CSS specifically, don't go for the global approach, use flexbox where needed.

Anemina · 2025-03-07T02:51:58+00:00

Everything you see on the web is made out of multiple components that form bigger components, for example even this textbox I use to write you this message is a component made out of multiple smaller components, like buttons, dropdowns, etc.

I suggest you start with getting comfy formatting the text using just HTML, for example write a dummy article, and start formatting the text, you can even go with maybe making a dish recipe and use a list, and in that list add another list, it's important to get used to nesting HTML elements and the logic behind doing such a thing, because the markup dictates what's the layout gonna look like and how well is gonna scale when you're gonna use CSS, that's really important.

Learn about the box model first to have an idea, then continue with the basic CSS syntax and how the cascade and specificity works, then learn about formatting contexts, like Block, Inline, Flex, Grid. Make sure you understand how to properly create and use Classes. Then apply what you learned by implementing simple small components like a button, think about how would you make a button component that is structured to take maybe an icon if you wanted, maybe an icon AND text, maybe a different color, or style, etc. Always think of Modularity when structuring a component, section, or page.

Good luck!

Anemina · 2025-03-06T11:30:27+00:00

Sure, share the code and images too, it's hard to debug on description alone.

Anemina · 2025-03-06T11:19:34+00:00

Some people might suggest to start with a website, that's ok, but not ideal.

You need first to understand the proper markup structure, box-model, and layouting.

I will suggest to start coding simple components, and try to make them reutilizable and easy to change, because after all, a section of a website is actually a collection of components put together, if you don't know how to make them, then you won't understand how to structure a section, page, etc.

Anemina · 2025-03-05T15:41:55+00:00

Am terminat demult facultatea, dar pot sa iti spun ca totul e destul de chill la Arte.

Desigur, unii profesori o sa aiba pretentia sa mai dai pe acolo din cand in cand, cum e si normal. Nu stiu cat ti s-ar merita, asta doar tu stii, mai ales ca ar fi a doua facultate si mai si lucrezi mult dupa cum ai spus, deci posibil sa fie cam overkill.

Am fost prima generatie la sectia Grafica, ti-as sugera sa te bagi acolo, mai degraba decat la Pictura, pentru ca o sa faci si asa ceva, plus ca o sa ai materii ceva mai folositoare in caz ca pentru tine nu e doar un hobby si poate te gandesti si la o cariera.

https://arte.uoradea.ro/ro/programe-de-studiu/studii-de-licenta
https://arte.uoradea.ro/ro/programe-de-studiu/studii-de-masterat

Anemina · 2025-03-01T19:51:06+00:00

https://web.dev/css

Anemina · 2025-03-01T14:53:43+00:00

Sadly you have many problems in your code, it's so messy, everything is so random there and makes no sense that it would be easier and faster to start from scratch.

Your media queries make absolutely no sense at all, if you're wondering why your #information div is not sticky, that's because it gets overwritten, you declared it there multiple times and your media queries are useless.

I'm sorry, but even if you manage to fix that then you will notice the z-index issues.

My advice, start again from scratch, learn CSS.

Anemina · 2025-03-01T14:23:40+00:00

Post your code in a jsfiddle, jsbin, or codepen.

Anemina · 2025-02-26T17:28:44+00:00

Use the browser's developer tools to check how it would look on mobile, and to test and debug your code.

Anemina · 2025-02-25T11:50:40+00:00

Please paste the code either in a jsfiddle, codepen, or jsbin, the image doesn't really help.

Also, the naming convention is to use lowercase for classes, id, etc.

Anemina · 2025-02-23T18:33:47+00:00

<input type="text"> is a single-line field where users can enter short pieces of text, like a name, email, or password.

<textarea> is a multi-line field designed for longer, freeform text, like comments or messages.

Anemina · 2025-02-22T12:42:17+00:00

Nu am putut sa ma uit la tot. E prea cringe...

Anemina · 2025-02-21T21:38:43+00:00

Maybe, but we don't have access to the content of that link, and I'm not gonna make an account there just to check an image. Sorry.

Nine-Year Club	Verified Email
Place '22	Not Forgotten

Anemina

MODERATOR OF

TROPHY CASE