diff options
| -rw-r--r-- | template/yoga/content.css | 29 | ||||
| -rw-r--r-- | template/yoga/default-colors.css | 12 |
2 files changed, 24 insertions, 17 deletions
diff --git a/template/yoga/content.css b/template/yoga/content.css index 725e5f95d..a1e1a6de5 100644 --- a/template/yoga/content.css +++ b/template/yoga/content.css @@ -145,20 +145,22 @@ ul.categoryActions { /* User comments */ +#content DIV#comments { + padding-left: 5px; + padding-right: 5px; + -moz-box-sizing: padding-box; +} #content DIV.comment { - margin: 5px; - border: 1px solid gray; - min-height: 150px; /* maximum thumbnail height */ + margin: 0 0 0.5em 0; + padding: 0; + overflow: hidden; /* these 2 lines ensure the floating child is kept in the DIV */ + width: 100%; /* don't ask why. It's a very usefull trick */ } -#content DIV.comment > A.illustration { +#content DIV.comment A.illustration { display: block; - position: absolute; - margin: 5px; -} - -#content DIV.comment > A.illustration IMG { - border: 1px solid gray; + float: left; + margin: 0.5em 0 0 0.5em; } #content DIV.comment P.commentHeader { @@ -171,18 +173,15 @@ ul.categoryActions { margin: 0.2em; } -#content DIV.comment > UL.actions > LI { +#content DIV.comment UL.actions LI { display: inline; } #content DIV.comment BLOCKQUOTE { - margin: 1em 1em 1em 140px; /* margin-left corresponds to maximum thumbnail width */ - border: 1px solid #d3d3d3; - border-left: 2px solid gray; + margin: 1em 0.5em 0.5em 150px; /* margin-left corresponds to maximum thumbnail width + ~10px */ padding: 0.5em; } - /* should be in admin.css ? CSS properties also used in popuphelp */ SPAN.pwgScreen { diff --git a/template/yoga/default-colors.css b/template/yoga/default-colors.css index 3edf2d7cc..3f26e9208 100644 --- a/template/yoga/default-colors.css +++ b/template/yoga/default-colors.css @@ -98,9 +98,17 @@ A.navThumb, A.navThumb:hover { background:#eeeeee; } +/* User comments */ +#content DIV.comment { + border: 1px solid gray; +} -#comments BLOCKQUOTE { - background: #eeeeee; +#content DIV.comment A.illustration IMG { + border: 1px solid gray; +} + +#comments DIV.comment BLOCKQUOTE { + border: 1px solid #d3d3d3; border-left: 2px solid #696969; } |