Re: [css-d] Trying to override site style sheet with inline CSS?
9.10.2011 2:03, Mark Henderson wrote:
Keith Purtell wrote:
But one item defies all efforts. For some reason, hiss CSS for general
text content is set up with a 1cm indent, which looks pretty ugly.
I've been tolerating it with paragraphs, but it also kicks in whenever
I try to add a list, which is uglier yet (screen capture:
http://www.keithpurtell.com/kthings/gaps.jpg). I tried inserting
inline CSS of text-indent:0 in both the ol and the lis but it
didn't have any effect. What to do to banish this monster?
A screen shot for code debugging just isn't going to cut it I'm afraid.
Help yourself by helping us and provide a public clickable link or your
own simplified test case of the problem,
That's very good advice. It's often crucial to post a URL early, partly
because people who might be able to help may lose interest when reading
through discussions that aren't particularly useful, due to lack of
sufficient data.
In this specific case, I was able to track down the problem with my
advanced ESP, though Google helped a little. :-) I'm pretty sure the URL
(or at least _a_ relevant URL) is
http://tahlequahnow.com/story.php?id=568
and I'm sure there's the problem there that the attribute name style has
been misspelled as stye (so browsers just ignore the attributes).
Setting text-indent: 0 in style attributes overrides the overall
settings, but there are simpler ways, such as putting
li { text-indent: 0; }
inside a style element. This should suffice, since currently the li
elements have no text-indent explicitly set, they just inherit it from
div.newsitem. (And any explicit setting, no matter how weak
cascade-wise, breaks inheritance.)
There might be a problem, though. Although a text-indent of 1cm is not
particularly suitable for list items, it helps to visually separate the
items from each other. If you remove that, I would consider setting,
say, a bottom margin of 0.3em for li elements, or something similar (in
cases like this, where list items may span several lines).
--
Yucca, http://www.cs.tut.fi/~jkorpela/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Floating Boxes Text Wrap Help
*Sigh* -- I'm getting nowhere with this and hoping someone can help. On pages like this http://rchseaglesnest.org/extra/dread-test/ and this http://rchseaglesnest.org/pumpkin/, I've got some boxes floated to the right -- one holding an image, and the other, beneath it, that can potentially hold a list of links. Depending on the size of the image and the length of the links list, widths and heights may vary. Right now, I've got both boxes contained in another div, so the structure's roughly like this: div#container div#photo /div div#links /div /div I'd like for the surround text to wrap in around the narrower links box. But if I take the container div away, the links box ends up a considerable distance further down the page, all by itself. Can anyone explain that behavior for me? The only way I've found to keep both boxes together is to wrap them inside that other div, which gives me gap in the body text I'd rather not have. Is there any way to get the text to flow the way I'd like? Or am I just stuck? Thanks! Jeff. __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Floating Boxes Text Wrap Help
On 10/10/2011 12:17 AM, Jeff Ferrell wrote:
*Sigh* -- I'm getting nowhere with this and hoping someone can help.
On pages like this http://rchseaglesnest.org/extra/dread-test/ and
this http://rchseaglesnest.org/pumpkin/, I've got some boxes floated
to the right -- one holding an image, and the other, beneath it, that
can potentially hold a list of links. Depending on the size of the
image and the length of the links list, widths and heights may vary.
Right now, I've got both boxes contained in another div, so the
structure's roughly like this:
div#container div#photo /div div#links /div /div
I'd like for the surround text to wrap in around the narrower links
box. But if I take the container div away, the links box ends up a
considerable distance further down the page, all by itself. Can
anyone explain that behavior for me? The only way I've found to keep
both boxes together is to wrap them inside that other div, which
gives me gap in the body text I'd rather not have.
Is there any way to get the text to flow the way I'd like? Or am I
just stuck?
Thanks! Jeff.
I guess you have not noticed the below CSS contained in the selectors on
line 1078 and line 1877.
#review-meta-container, #post-meta-container {
float: right;
margin-left: 10px;
margin-bottom: 10px;
}
#post-meta-container {
float: right;
}
It seems to work (text flowing around boxes) if you change the later to
this.
#post-meta-container {
float: none;
}
--
Alan Gresley
http://css-3d.org/
http://css-class.com/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] dynamic CSS strategies
This is a CSS discussion list. So programming issues are not on topic here. But if I keep my dynamic CSS question abstract enough I don't see why it isn't a CSS issue as much as anything else. Let's say my content management system is currently using a three column layout, where a left side column of links is usually defined as 16% of available width. However, if it turns out the current page has a larger than normal number of navigation links, I could (somehow) set the navigation column width to 25% so it could contain two vertical rows of clickable links, rather than one vertical column. What is the best way to do this? My CMS codes could calculate the number of needed links before generating any output, and then choose from any one of several hard-coded CSS files depending on the total link count. Or I could manipulate the browser's CSS on the fly with Javascript and the DOM tree (which used to be a browser-sniffing nightmare, the last time I tried it). Are there any alternate strategies I'm not aware of.simply because I'm an amateur hacker and not a well-educated professional? -- /* Colin (Sandy) Pittendrigh --oO0 Have code will travel */ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] dynamic CSS strategies
On 10/9/11 10:22 AM, Colin (Sandy) Pittendrigh wrote: Let's say my content management system is currently using a three column layout, where a left side column of links is usually defined as 16% of available width. However, if it turns out the current page has a larger than normal number of navigation links, I could (somehow) set the navigation column width to 25% so it could contain two vertical rows of clickable links, rather than one vertical column. What is the best way to do this? With a media query? http://www.w3.org/TR/css3-mediaqueries/ ~d -- Desktop. Laptop. Tablet. Mobile! http://chelseacreekstudio.com/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] dynamic CSS strategies
One solution is to use your server-side programming to dynamically generate the CSS file. This way you can control all sorts of things in your layout and look-and-feel relative to your database queries. In your case, for your column of links, write an IF/ELSE statement based on the record count. This code would be in the file that generates the CSS file that is sent to the browser. Such as site_styles.cfm or .php or .asp, or ... which generates site_styles.css IF #record count# x [css for one column width] ELSE [css for two columns] The downside to this approach is that your CSS file is regenerated and transmitted with EVERY call from the browser. A workaround to this problem would be to use inline CSS in the page that contains the link-list column(s). This way you're not regenerating the entire CSS file, just the particular code (selectors and rules) that pertain to a specific area of your page. This, of course, generates the dreaded future maintenance problem(s)--you now can't go to one place to maintain your CSS, it is now distributed throughout the site code/pages. Dan K -Original Message- From: css-d-boun...@lists.css-discuss.org [mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Colin (Sandy) Pittendrigh Sent: Sunday, October 09, 2011 7:22 AM To: css-d@lists.css-discuss.org Subject: [css-d] dynamic CSS strategies This is a CSS discussion list. So programming issues are not on topic here. But if I keep my dynamic CSS question abstract enough I don't see why it isn't a CSS issue as much as anything else. Let's say my content management system is currently using a three column layout, where a left side column of links is usually defined as 16% of available width. However, if it turns out the current page has a larger than normal number of navigation links, I could (somehow) set the navigation column width to 25% so it could contain two vertical rows of clickable links, rather than one vertical column. What is the best way to do this? My CMS codes could calculate the number of needed links before generating any output, and then choose from any one of several hard-coded CSS files depending on the total link count. Or I could manipulate the browser's CSS on the fly with Javascript and the DOM tree (which used to be a browser-sniffing nightmare, the last time I tried it). Are there any alternate strategies I'm not aware of.simply because I'm an amateur hacker and not a well-educated professional? -- /* Colin (Sandy) Pittendrigh --oO0 Have code will travel */ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] dynamic CSS strategies
None of the above: Use a class to determine the various layout
conditions. Assuming some kind of inline templating engine:
CSS:
.navigation {
width: 16%;
}
.navigationWide {
width: 25%;
}
Template:
div class=navigation[ if(linkCount = largeNumber){ print
navigationWide } ]
ul
lia href=etc
etc
etc
Keep all your CSS in one place, introduce CSS hooks from the backend
depending on your various conditions. If your back-end isn't that
flexible, DOM Javascript can provide.
Regards,
Barney Carroll
barney.carr...@gmail.com
07594 506 381
On 9 October 2011 15:40, Dan Kaufman d...@studiokaufman.com wrote:
One solution is to use your server-side programming to dynamically generate
the CSS file. This way you can control all sorts of things in your layout
and look-and-feel relative to your database queries.
In your case, for your column of links, write an IF/ELSE statement based on
the record count. This code would be in the file that generates the CSS file
that is sent to the browser. Such as site_styles.cfm or .php or .asp, or
... which generates site_styles.css
IF #record count# x
[css for one column width]
ELSE
[css for two columns]
The downside to this approach is that your CSS file is regenerated and
transmitted with EVERY call from the browser. A workaround to this
problem would be to use inline CSS in the page that contains the link-list
column(s). This way you're not regenerating the entire CSS file, just the
particular code (selectors and rules) that pertain to a specific area of
your page. This, of course, generates the dreaded future maintenance
problem(s)--you now can't go to one place to maintain your CSS, it is now
distributed throughout the site code/pages.
Dan K
-Original Message-
From: css-d-boun...@lists.css-discuss.org
[mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Colin (Sandy)
Pittendrigh
Sent: Sunday, October 09, 2011 7:22 AM
To: css-d@lists.css-discuss.org
Subject: [css-d] dynamic CSS strategies
This is a CSS discussion list. So programming issues are not on topic
here.
But if I keep my dynamic CSS question abstract enough I don't see why it
isn't a CSS issue as much as anything else.
Let's say my content management system is currently using a three column
layout, where a left side column of links is usually defined as 16% of
available width.
However, if it turns out the current page has a larger than normal number
of navigation links, I could (somehow) set the navigation column width to
25% so it could contain two vertical rows of clickable links, rather than
one vertical column.
What is the best way to do this?
My CMS codes could calculate the number of needed links before generating
any output, and then choose from any one of several hard-coded CSS files
depending on the total link count. Or I could manipulate the browser's CSS
on the fly with Javascript and the DOM tree (which used to be a
browser-sniffing nightmare, the last time I tried it). Are there any
alternate strategies I'm not aware of.simply because I'm an amateur
hacker and not a well-educated professional?
--
/* Colin (Sandy) Pittendrigh --oO0
Have code will travel */
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Trying to override site style sheet with inline CSS?
- Original Message
From: Keith Purtell keithpurt...@keithpurtell.com
To: css discuss css-d@lists.css-discuss.org
Sent: Sat, October 8, 2011 3:23:46 PM
Subject: [css-d] Trying to override site style sheet with inline CSS?
I've taken on a project supplying content for an online new source. The problem
is that the guy who set it up did a pretty good job with the PHP (and most the
HTML and CSS) that allows me to use password-protected forms to upload articles
and photos. I can also tweak some of my content occasionally by using inline
CSS.
But one item defies all efforts. For some reason, hiss CSS for general text
content is set up with a 1cm indent, which looks pretty ugly. I've been
tolerating it with paragraphs, but it also kicks in whenever I try to add a
list, which is uglier yet (screen capture:
http://www.keithpurtell.com/kthings/gaps.jpg). I tried inserting inline CSS of
text-indent:0 in both the ol and the lis but it didn't have any effect.
What
to do to banish this monster?
- Keith Purtell
Keith,
The style sheet for the text indent may have ' !important ' added to it. If
that
is the case, one way to override it is to add the same tag to your inline
styling. As the html is read from top to bottom, the second !important will
override the first one (in the style sheet). This may have ramifications
elsewhere in your page so look for any other problems that may crop up. The
following code will show that when you add or delete !important from the
inline
styling, the text will take on the new color or indent, or revert to the
styling
in the embed style sheet.
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html
body
head
titleInline Styling Test/title
style TYPE=text/css
p {color: red !important; text-indent: 100px !important;}
/style
/head
div style=margin:0;padding:0
table width=400 height=140 bgcolor=#f0f0f0 cellpadding=0
cellspacing=0
tbody
tr
td valign=top
p style=text-indent: 0px !important; color: blue;Sed ut perspiciatis unde
omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam
rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto
beatae vitae dicta sunt explicabo. /p
/td
/tr
/tbody
/table
/div
/body
/html
Rod Castello
email marketing specialist
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] dynamic CSS strategies
Excellent solution Barney!
Same general concept IF, but much more elegantly and efficiently delivered.
Dan K
-Original Message-
From: css-d-boun...@lists.css-discuss.org
[mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Barney Carroll
Sent: Sunday, October 09, 2011 8:14 AM
To: Dan Kaufman
Cc: Colin (Sandy) Pittendrigh; css-d@lists.css-discuss.org
Subject: Re: [css-d] dynamic CSS strategies
None of the above: Use a class to determine the various layout
conditions. Assuming some kind of inline templating engine:
CSS:
.navigation {
width: 16%;
}
.navigationWide {
width: 25%;
}
Template:
div class=navigation[ if(linkCount = largeNumber){ print
navigationWide } ]
ul
lia href=etc
etc
etc
Keep all your CSS in one place, introduce CSS hooks from the backend
depending on your various conditions. If your back-end isn't that
flexible, DOM Javascript can provide.
Regards,
Barney Carroll
barney.carr...@gmail.com
07594 506 381
On 9 October 2011 15:40, Dan Kaufman d...@studiokaufman.com wrote:
One solution is to use your server-side programming to dynamically
generate
the CSS file. This way you can control all sorts of things in your layout
and look-and-feel relative to your database queries.
In your case, for your column of links, write an IF/ELSE statement based
on
the record count. This code would be in the file that generates the CSS
file
that is sent to the browser. Such as site_styles.cfm or .php or .asp, or
... which generates site_styles.css
IF #record count# x
[css for one column width]
ELSE
[css for two columns]
The downside to this approach is that your CSS file is regenerated and
transmitted with EVERY call from the browser. A workaround to this
problem would be to use inline CSS in the page that contains the
link-list
column(s). This way you're not regenerating the entire CSS file, just the
particular code (selectors and rules) that pertain to a specific area of
your page. This, of course, generates the dreaded future maintenance
problem(s)--you now can't go to one place to maintain your CSS, it is now
distributed throughout the site code/pages.
Dan K
-Original Message-
From: css-d-boun...@lists.css-discuss.org
[mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Colin (Sandy)
Pittendrigh
Sent: Sunday, October 09, 2011 7:22 AM
To: css-d@lists.css-discuss.org
Subject: [css-d] dynamic CSS strategies
This is a CSS discussion list. So programming issues are not on topic
here.
But if I keep my dynamic CSS question abstract enough I don't see why it
isn't a CSS issue as much as anything else.
Let's say my content management system is currently using a three column
layout, where a left side column of links is usually defined as 16% of
available width.
However, if it turns out the current page has a larger than normal number
of navigation links, I could (somehow) set the navigation column width to
25% so it could contain two vertical rows of clickable links, rather than
one vertical column.
What is the best way to do this?
My CMS codes could calculate the number of needed links before generating
any output, and then choose from any one of several hard-coded CSS files
depending on the total link count. Or I could manipulate the browser's
CSS
on the fly with Javascript and the DOM tree (which used to be a
browser-sniffing nightmare, the last time I tried it). Are there any
alternate strategies I'm not aware of.simply because I'm an amateur
hacker and not a well-educated professional?
--
/* Colin (Sandy) Pittendrigh --oO0
Have code will travel */
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org --
Re: [css-d] dynamic CSS strategies
On 10/9/11 11:18 AM, Dan Kaufman wrote: Excellent solution Barney! Same general concept IF, but much more elegantly and efficiently delivered. Dan K Gentlepeople, How about trimming your replies to the list so all of us do not wind up with an in-box full of stuff we have already read [see list policy]. And top-posting, among other things, screws up the list archives so the next guy looking to find a solution to the same problem may have difficulty doing so [there is no list policy forbidding top-posting, but is appreciated by those among us who use the archives-- and have been on the list for awhile... Best, ~d PS I am not a list administrator. -- Desktop. Laptop. Tablet. Mobile! http://chelseacreekstudio.com/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Floating Boxes Text Wrap Help
On Oct 9, 2011, at 10:03 AM, Alan Gresley wrote:
I guess you have not noticed the below CSS contained in the selectors on line
1078 and line 1877.
#review-meta-container, #post-meta-container {
float: right;
margin-left: 10px;
margin-bottom: 10px;
}
#post-meta-container {
float: right;
}
It seems to work (text flowing around boxes) if you change the later to this.
#post-meta-container {
float: none;
}
Ah yes, sorry -- that's some needless doubling-up. (The fact that there exists
a line 1877 in my css is a good indication that I have a lot of cleaning I need
to do!)
Let me make sure we're seeing the same thing. (I'm only looking at Chrome and
Firefox for right now, btw.) When I change the float to none (actually, I
removed line 1877…no need for it), *I* see the layout that I added the
container to try to avoid. It looks like this:
http://ferrellweb.com/temp/no-container.gif -- is that what you're seeing?
The effect I'm trying to achieve (ideally) is this:
http://ferrellweb.com/temp/desired.gif
But my floated container div is (predictably) giving me this:
http://ferrellweb.com/temp/container-div.gif
(Whoops. I trimmed off some important bits. Actual page examples in question
again: http://rchseaglesnest.org/extra/dread-test/ and
http://rchseaglesnest.org/pumpkin)
Jeff.
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Text-indent and 100% height issues
On Oct 8, 2011, at 8:13 PM, David Laakso wrote: Yeah. Math ain't our bag. We work visually -- as in put up and tickle it until it looks right -- or, at least, sort of... Revised layout on our server: http://chelseacreekstudio.com/jaj-v1.html Ha! yeah... Well, the idea that you take some thing from the content block, then take some thing from the children makes and made sense to me.. I wanted to make sure that I truly got the lessons of your code. thank you! John __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Floating Boxes Text Wrap Help
On 10/10/2011 2:54 AM, Jeff Ferrell wrote:
On Oct 9, 2011, at 10:03 AM, Alan Gresley wrote:
I guess you have not noticed the below CSS contained in the
selectors on line 1078 and line 1877.
#review-meta-container, #post-meta-container { float: right;
margin-left: 10px; margin-bottom: 10px; }
#post-meta-container { float: right; }
It seems to work (text flowing around boxes) if you change the
later to this.
#post-meta-container { float: none; }
Ah yes, sorry -- that's some needless doubling-up. (The fact that
there exists a line 1877 in my css is a good indication that I have a
lot of cleaning I need to do!)
I would say so and all those extra style sheet. I couldn't maintain that.
Let me make sure we're seeing the same thing.
Sounds good.
(I'm only looking at
Chrome and Firefox for right now, btw.) When I change the float to
none (actually, I removed line 1877…no need for it), *I* see the
layout that I added the container to try to avoid. It looks like
this: http://ferrellweb.com/temp/no-container.gif -- is that what
you're seeing?
No.
The effect I'm trying to achieve (ideally) is this:
http://ferrellweb.com/temp/desired.gif
Yes, that seem right.
But my floated container div is (predictably) giving me this:
http://ferrellweb.com/temp/container-div.gif
That's what you would expect by floating it. Since you have removed the
CSS starting at line 1877, lets move on to the part beginning at line 1078.
#review-meta-container, #post-meta-container {
float: right;
margin-left: 10px;
margin-bottom: 10px;
}
Change it to this.
#review-meta-container {
float: right;
margin-left: 10px;
margin-bottom: 10px;
}
If you do that, you don't even need div#post-meta-container but it
doesn't hurt to just be there.
(Whoops. I trimmed off some important bits. Actual page examples in
question again: http://rchseaglesnest.org/extra/dread-test/ and
http://rchseaglesnest.org/pumpkin)
Jeff.
--
Alan Gresley
http://css-3d.org/
http://css-class.com/
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Pages get weird when uploaded
Here are 2 pages, each built on the SAME structure: http://www.coffeeonmars.com/testing/index.html http://www.coffeeonmars.com/testing/WPR_Wire.html they are SUPPOSED to look like this one: http://www.coffeeonmars.com/testing/redo_WPR_Wire.html Can somebody please help me to understand what happened? I began with one that worked both locally and online, and replaced the content (words) bit by bit, proofed them locally. they get online in my site folder and looks like they went through a blender! Thanks much for assistance on this..kind of a struggle to build skill in this for me. John __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pages get weird when uploaded
On Sun, Oct 9, 2011 at 7:05 PM, John j...@coffeeonmars.com wrote:
Here are 2 pages, each built on the SAME structure:
http://www.coffeeonmars.com/testing/index.html
http://www.coffeeonmars.com/testing/WPR_Wire.html
they are SUPPOSED to look like this one:
http://www.coffeeonmars.com/testing/redo_WPR_Wire.html
Can somebody please help me to understand what happened? I began with one
that worked both locally and online, and replaced the content (words) bit by
bit, proofed them locally.
they get online in my site folder and looks like they went through a
blender!
Thanks much for assistance on this..kind of a struggle to build skill in
this for me.
Let's go through some quick troubleshooting step by step.
Open your good page and one of your bad pages in Chrome. (You could use
other browsers but these exact steps will be specific to Chrome.)
In the good page, right click your UX logo at the top and click Inspect
Element.
This will open the debugger panel including the styles applied to the
element. You'll see this style among others:
#header img {
float: left;
margin-right: 20px;
}
Now do the same thing in your bad page. Notice anything missing?
That should point you toward what you need to fix...
-Mike
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pages get weird when uploaded
On 10/9/11 10:05 PM, John wrote: Here are 2 pages, each built on the SAME structure: http://www.coffeeonmars.com/testing/index.html http://www.coffeeonmars.com/testing/WPR_Wire.html Can somebody please help me to understand what happened? John The style sheet does not match the markup. Best, Bonnie and Clyde -- Desktop. Laptop. Tablet. Mobile! http://chelseacreekstudio.com/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Trying to override site style sheet with inline CSS?
On 10/9/2011 12:24 PM, css-d-requ...@lists.css-discuss.org wrote: Date: Sun, 09 Oct 2011 12:03:34 +1300 From: Mark Henderson shadefro...@gmail.com To: css discuss css-d@lists.css-discuss.org Subject: Re: [css-d] Trying to override site style sheet with inline Keith Purtell wrote: But one item defies all efforts. For some reason, hiss CSS for general text content is set up with a 1cm indent, which looks pretty ugly. I've been tolerating it with paragraphs, but it also kicks in whenever I try to add a list, which is uglier yet (screen capture: http://www.keithpurtell.com/kthings/gaps.jpg). I tried inserting inline CSS of text-indent:0 in both theol and thelis but it didn't have any effect. What to do to banish this monster? A screen shot for code debugging just isn't going to cut it I'm afraid. Help yourself by helping us and provide a public clickable link or your own simplified test case of the problem, and I am sure someone will find a solution. FWIW, it doesn't sound like it's limited to text elements and I would be inclined to look at any wrapper divs in question and check for margin or padding on those (but I am just guessing, because in this case a picture does NOT tell a thousand words!). Here'a a direct link... http://tahlequahnow.com/story.php?id=568 (P.S. Tried the !important method without success.) - Keith __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Trying to override site style sheet with inline CSS?
10.10.2011 5:57, Keith Purtell wrote: Here'a a direct link... http://tahlequahnow.com/story.php?id=568 Didn't you get my message that I sent to the list? (Sen Sun, 09 Oct 2011 13:20:32 +0300) You have the HTML attribute name style misspelled as stye. (P.S. Tried the !important method without success.) It's not needed if you write the attribute name correctly, and it won't help if you don't. -- Yucca, http://www.cs.tut.fi/~jkorpela/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pages get weird when uploaded
10.10.2011 5:05, John wrote: Here are 2 pages, each built on the SAME structure: - - they are SUPPOSED to look like this one: - - Can somebody please help me to understand what happened? The pages you mentioned first refer to an external style sheet quite different from the one referred to by the third one- I began with one that worked both locally and online, and replaced the content (words) bit by bit, proofed them locally. Are you saying that you only changed the content, not markup or stylesheet? they get online in my site folder and looks like they went through a blender! Perhaps the two .css files referred to (Styles_A.css vs. redo_Styles_A.css, with relative addresses) aren't the same locally as online. -- Yucca, http://www.cs.tut.fi/~jkorpela/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pages get weird when uploaded
On Oct 9, 2011, at 8:34 PM, Jukka K. Korpela wrote: The pages you mentioned first refer to an external style sheet quite different from the one referred to by the third one- I began with one that worked both locally and online, and replaced the content (words) bit by bit, proofed them locally. Are you saying that you only changed the content, not markup or stylesheet? they get online in my site folder and looks like they went through a blender! Perhaps the two .css files referred to (Styles_A.css vs. redo_Styles_A.css, with relative addresses) aren't the same locally as online. OK..this is pretty embarrassing, but I'll man up and own it. I had been using the name Styles_A.css and made my style sheet today the same name. I uploaded the markup and the graphics, but did not upload (and therefore overwrite) the old Styles_A.css Pretty dumb mistake would be the category I'd pick. But it's good to have that Chrome functionality at one's disposal. Jukka; As I made one page from the first, I changed my content within h1, h2, and p tags, etc. leaving the structure in place and changing just the text, trying to be methodical as I possibly can. I need to do so also with the uploading of my stylesheets. :-( thank you, J __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Pages get weird when uploaded EC
On Oct 9, 2011, at 8:56 PM, John wrote: I had been using the name Styles_A.css and made my style sheet today the same name. I uploaded the markup and the graphics, but did not upload (and therefore overwrite) the old Styles_A.css that should read did not upload the new, and therefore overwrite the old.. J __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
