Monday, January 02, 2017

CSS Bleg II

Thanks to Matt, I fixed the weird table format problem. Now I want to get the registers up next to the code input field. I copied the CSS for doing this straight out of a book... and it don't work the same! The problem is almost surely that some native Django CSS is interfering with what the book is trying to do... but I just don't know CSS well enough yet to determine which bits are the culprits.

Here's the CSS file.

Here's the HTML template.

And here's the result.

The table listing the registers should be up next to the code input field. As you can see, there's plenty
of room: the table floats to the right of the input field with some room to spare. So why is it being placed below it?

The Django form is inside a div tag... so Django ought to render it inside the div and not block something appearing to its right.

UPDATE: Well, I "forced" things to work by using a table instead of divs. But that is supposed to be the bad, old-fashioned way of doing this!

2 comments:

  1. You may already be aware of this, but the best tool for figuring out stylesheet issues is a modern web browser. In Chrome, IE, Firefox, and probably others, you can context-click any element and choose "Inspect element". This brings up a dialog that shows all of the styles currently applied to the element, the CSS source location they come from, and gives you the ability to selectively enable, disable, and edit styles on the fly for rapid iteration.

    ReplyDelete
    Replies
    1. No Matt: I haven't done web stuff for 15 years or so, and am just getting back into it.
      So HTML5 and CSS are pretty much brand new to me. I had no idea browsers did this!

      Delete

Distraction Deterrents in Small Contexts

"distracted from distraction by distraction" - T.S. Eliot I've been reading a little on how Facebook and other social netwo...