How to Make CSS3 Columns Display Properly [closed] - html

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Closed 9 years ago.
Improve this question
I am working on a website that uses CSS3 colums to break up the text of the article to three columns. In it's current state, there is a few paragraphs, an unordered list and a few more paragraphs.
I want the article to essentally read like a newspaper, but CSS is breaking this up in a really perculiar way, and I cannot figure out how to fix it. The current website is the Hospital Safety Store. Thanks for your help!

Quite frankly, with purely css and nothing else you can't split the contents of a single div across multiple columns like that.
Each column should be it's own DIV, which means you'll have to pre-split the article into three. You could do this manually but it'd probably less of a headache to write some php on the back-end to break up the article programmatically.
I'd typically have one container-div that is the full width, and then have child div's for the different columns.

Related

What is the best practice with containers? When is using multiple containers a good idea or not? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I am using Materialize CSS to create a homepage. I usually use one container to hold everything. This time, I used different containers to hold different elements, for instance, one for the navigation bar, one for the carousel, and so on. There are no containers within containers.
Is this good to do? What is the best practice with containers?
Some times using multiple containers is ok and even required. For example think of page with multiple full width element, which contains different background color and centered content. These full width elements could be <section>s and centered content could be containers.
You have to think is your solution logical. If you can figure reason for your element to have it's own container, then it is ok to use. If you provide link to your work, i could give my opinion.
As clear answer to your question, i think it is good to use multiple containers if page structure requires. Container is just one element among the others.

Can a table be styled like this? Or would something else be better? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
Basically I am working on some practices since last week to start learning html and css, and I wanted to create a table of sorts to display items with the option to see more info and take/buy it. I was thinking in adding some background icons or image hence the strange looking table.
My question is. Can something like that be styled or would a normal table be better? To illustrate my point I did a mockup of sorts.
Oh! And as not to make another question just for that, can a dropdown list be made to have checkboxs without using jQuery? I'm afraid that is completely out of my reach with my current knowledge.
http://i59.tinypic.com/25z47dh.png
Thanks a lot in advance
Best Wishes
You have a few options:
You may use display: table and assign table 'rows' and 'columns' on div tags.
Or
You may use float: left which will line everything like a table and be more responsive.
Or
You may use display: inline-block which will behave a lot like the floats except you get a little bit more control on box height.
There is no correct answer here but my preference is with inline-block since browser support tends to be superior than floats while keeping everything responsive.

Can't click on links, mark text, how can I fix this? [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Closed 9 years ago.
Improve this question
I am making a website, and I've added a list and made the list links to different websites.
The problem is that on the website it shows that they are links but I can't click them, or mark them or anything. I can't mark the text on the website either.
Yes a bit of your code would be helpful.
But it sounds, that some container overlapping your content if you reduce the size of your Browser-Window.
Just check that
Edit // If that is the problem, try to give your content a higher z-index.
Sounds like you're not using the <a> element.
See this tutorial on how to make a link.

HTML Using extends in if statment [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I have two different HTML layouts. I have created an if statement and depending on the circumstance, I would like to extend one of the two HTML layouts. I am not sure if this is possible or not. This is what I want to do:
- if validlink
- extends "layouts/successful.html"
- else
- extends "layouts/unsuccessful.html"
I think that it's better if you change the perspective. If you design two different div, each one with he content of the HTML that you have and then, when you do the if statement, you show the one that you need.
EX:
if (validlink)
document.getElementById(ID_OF_DIV).style.visibility="visible";
else
document.getElementById(ID_OF_DIV).style.visibility="hidden";
You can call it with a function or whatever you want. its really easy. It's a function of javascript. HTML/PHP+CSS+JAVASCRIPT is powerful.
Simply and easy in my opinion.

Text appearing stacked in page pseudo CSS3/HTML5 [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 8 years ago.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Improve this question
I'm making a web page for a charity and the text on the page is appearing stacked without my intention. I decided to play around with CSS3 and HTML5 (badly) so it won't be fully compliant.
I've tried searching and looked at some articles about how to stack with css3 but it doesn't seem that I've accidently implemented any of these by accident. It's in PHP for no other reason than to use 'include' and because I plan on expanding it so all the html and css you can see on the page is all that's going on.
The footer is appearing behind the main body of text.
http://aberystwythslsc.org/activities.php
Any help would be greatly appreciated.
Your <section> has a set height. Simply remove that and you'll be good to go.