I can’t get flex row to work. https://jsfiddle.net/1zuapwx5/33/
How come this:
Looks so much different than this:?
different code?
maybe I’m not able to use fireflex.
It’s not easy. Takes lots of study and experience. I’m not comfortable enough with my knowledge to use it in public, yet. Getting there, but not yet.
How would I remove the space on the bottom of this then?
I need your help with this: https://jsfiddle.net/soledar10/jp239wgq/
How do I set padding only for items 1 through 6?
And have padding for items 7 through 9 be different?
I put it into blogger and it looks horrible: https://testblog567895.blogspot.com/
In what way? Is it not behaving as you expect, or is there some other issue?
It would really be very helpful if you could put a little more thought into your posts and the way you structure them. Rather than posting a whole series of one-liners saying “I need help with this” or “this doesn’t work”, please take the time to give more detail. In particular, please keep us up-to-date with which issues have been resolved and how. For example, you mentioned an issue with padding, started another topic, linked to it twice above, and have now marked it “[Solved]”. (Hence I’m assuming your “it looks horrible” comment has nothing to do with that.)
I’m aware that you are also posting on Stack Overflow, which of course you are free to do. However, if you have received an answer there to a question you have also asked here, it is only courteous to post the solution here - or at least a brief summary of it - to let others know you no longer require assistance with that particular issue.
Hey @asasass ,
I would like to give you one friendly suggestion.Find some courses, there are bunch of free and paid, about HTML and CSS basics.It’s not so easy stuff, but once when you learn basics, you can easily upgrade your CSS skill and work with latest development technologies.
Table layout structuring is deprecated several years ago, so there are no good reason to do It anymore, It has a no advantages, except if you are working with tabular data - the other guys noticed you about that.
Don’t be afraid.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name=viewport content="width=device-width, initial-scale=1">
<title>Radio List</title>
<style>
* { outline: dashed 1px #d00 } /* For visualisation purpose only, do remove!! */
body {
max-width: 1200px;
width: 95%; /* Responsive */
margin: 1em auto; /* Centred. Wot no table?? */
font-size: 100%; /* Reset */
background: #000;
color: #fff;
}
h1 { text-align: center }
.wrapper {
color: #0059dd;
display: flex;
flex-flow: wrap;
justify-content: space-between;
list-style: none;
padding: 0;
counter-reset: radionum;
}
.wrapper li {
display: inline-block ; /* Fall-back */
padding: 0 5% 100px;
flex: 1 1 14em; /* Set flex basis, to set disired width, but allowing some stretching/squashing */
}
.wrapper li h2 {
counter-increment: radionum;
font-size: 2em;
margin-top: 0
}
.wrapper li h2::after { content: ' 'counter(radionum) } /* Add numbers */
audio { width: 100% }
</style>
<!--This bit... Only if you want to support old versions of IE that don't do Flex-->
<!--[if IE]><style> .wrapper { text-align: center } .wrapper li { width: 22%; text-align: left; min-width: 12em } </style><![endif]-->
</head>
<body>
<h1>Page Title</h1>
<ol class="wrapper">
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<li><h2>Radio</h2><audio controls="controls"></audio></li>
<!--However many...-->
</ol>
</body>
</html>
There’s a timely article here just on that very point
This is how I want the radio set up, I have everything set to a specific height and width. Can You make modifications to this code leaving the orange blocks? https://jsfiddle.net/dba0k1hm/1/
What sort of adjustment is it you want? Why do you keep asking such meaningless general questions?
If you want answers then be specific.
@asasass: repeatedly posting a link to another thread with no explanation is of no use to anyone. If the issue you are having is the subject of that thread, then please stop cross-posting and confine your questions to the correct topic.
You have now been asked multiple times by various members to take time to frame your questions clearly and coherently. You have even been provided with a link to an article demonstrating how to do this. It is in your own interests to do this, as members will rapidly tire of trying to guess what you want. If you can’t be bothered to explain your question, why should you expect anyone else to be bothered replying?
For me, I like to think can often do a fairly good job at “translating” poorly worded questions.
What I do have trouble with is the cross-posting.
I quickly lose the will to even attempt to keep up to date with what’s going on when it’s scattered all over the place.
I can understand the frustration. But cross-posting the same question phrased the same way is analogous to me progressively yelling louder in English to a non-English speaker in hopes they will for some reason understand me if I repeat myself often enough and loudly enough.
If you have trouble putting your question into words, try screenshots. For example, instead of posting
“How can I change the footer”
post something like