CODEWITHSUNDEEP
csssemantic-markup
StriplingWarrior
StriplingWarrior

Reputation: 156469

How can I convert this table-based layout to use semantic html with css-based layout?

Layout

In the image above, most of the html is semantic, using css to manage the look of it all. Despite my best efforts, though, I had to resort to using a table to get the segment on the right to stay where it is and allow its inner elements to wrap fluidly when it gets too big for the screen, like this: Too wide for the browser

I know that it's preferable if tables are only used for "tabular data," but I have never found a good way to force elements to do this without using tables. Has anybody solved this problem?

Upvotes: 1

Views: 177

Answers (2)

FatherStorm
FatherStorm

Reputation: 7183

have you tried using list-items? Generally when creating menu elements, it's better to use UL->LI instead of span or div

Upvotes: 1

0x1F602
0x1F602

Reputation: 865

You should be able to set the width of it. This is difficult to do without seeing the exact way you are doing this, because CSS is dependent on parent sizes, etc.

I would look into the CSS property min-width, too.

Upvotes: 0

Related Questions