|
#1
Mar 11, 2010, 07:39 PM
|
|
was fiddling with the footer, then everything went skewey.
http://www.petsintheclassroom.org/blog/
Blog title, sidebar titles shrunk and font reverted to verdana. Checked all tags that I can see. Did parent get messed up? What happened
Blog title CSS is this:
margin: 0;
padding: 0px 0px 0px 20px;
line-height: 1.0em;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 30px;
Body Style is this:
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
color: #000000;
background: url( http://www.petsintheclassroom.org/im...alkboard.gif);
padding-top: 20px;
What the heck happened?? :-)
Trying to figure out what is overriding the larger font I spec'd in the blog title.
Any thoughts. Double checked all my CSS for missing code pieces (like";"), but cannot find what is forcing the type small (and into Verdana)
TIA
Last edited by wordsnak; Mar 12, 2010 at 09:58 AM.
|
#2
Mar 12, 2010, 12:40 PM
|
|
Is there other information I should post that would help any of you to help solve this problem?
TIA
|
#3
Mar 12, 2010, 03:39 PM
|
|
Can anyone direct me to possibly a more appropriate forum for this question?
TIA
|
#4
Mar 12, 2010, 04:05 PM
|
|
|
|
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
|
|
the page looks fine to me - what were you doing in the footer?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
|
#5
Mar 12, 2010, 04:19 PM
|
|
Thanks for getting back to me!
Was changing text size, etc. in footer. That went well.
Saved page and it appeared that some sort of global modification took place that changed the title (but not the tagline) as well as the post title to a small size Verdana
See attachment.
The title "Pets in the Classroom Blog" should be 30px serif type (as I specified in the CSS)
Really puzzling. Been through all the code with a fine tooth comb.
I can't find where I can override this change.
Thinking that perhaps a glitch caused a problem to the code? I was going to start by going out of the admin and into page code next to see if I can track down the problem.
Last edited by wordsnak; Mar 12, 2010 at 04:33 PM.
|
#6
Mar 12, 2010, 04:33 PM
|
|
|
|
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
|
|
they are big for me. Do you have a macbook by any chance, did you accidentally do a squeeze on the track pad - or if using another browser, change the view size of the font?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
|
#7
Mar 12, 2010, 04:49 PM
|
|
Really weird. Is the title serif and not Verdana for you?
Using a G5 tower. Displays the same in both Safari & Firefox.
Just opened my Macbook and viewed it from there. Looks the same.
Last edited by wordsnak; Mar 12, 2010 at 04:54 PM.
|
#8
Mar 12, 2010, 05:02 PM
|
|
It has to be a parent CSS that's overriding it. Just wonder where else I can look.
Went into some of the php pages with BBedit, but not finding the CSS easily
|
#9
Mar 12, 2010, 05:09 PM
|
|
|
|
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
|
|
the problem is in your left sidebar. something weird is going on there. a bunch of styling and second <body> statement appear. this is what is messing up the page
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
|
#10
Mar 12, 2010, 05:19 PM
|
|
Left sidebar has two widgets in it.
I have no text styling options. Here is the css for the left side inner and outer
border-right: solid 6px #003399;
padding: 10px 10px 10px 10px;
background: #3399ff;
inner:
border-right: solid 6px #003399;
padding: 10px 10px 10px 10px;
background: #3399ff;
Where else could I go?
|
#11
Mar 12, 2010, 05:21 PM
|
|
Hmmm. I did add CSS into to a widget box. Let me disable it and see if that fixes it.
|
#12
Mar 12, 2010, 05:24 PM
|
|
That was the problem. I have to limit the CSS I use there.
I see that the post title gets its size cue from the blog title. How can I make the post title text smaller.
Also, I need to change the gray color. What do they call this title text?
|
#13
Mar 13, 2010, 11:02 AM
|
|
I use a widget, My Custom Widgets to create encapsulated html areas (like the logo and home button).
Love to know how I can use CSS in these without overriding the Atahulapa CSS. Even more surprised that Atahulapa puts this added-on CSS at a higher parent level.
|
#14
Mar 14, 2010, 05:37 AM
|
|
|
|
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
|
|
If you want CSS to affect the only the widget, then you need to give each of the elements in the widget a 'class' or 'id' that is different than the ones used by Atahualpa. This way you can code your slectors to address your html.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
|
#15
Mar 15, 2010, 05:39 PM
|
|
Thanks, surprised that I somehow gave it the same name.
To reduce the size of the blog entry title, I see that it follows the header title for size.
How can I make it smaller?
I see that the default size for header titles is 240%.
240% of what other text?
I specified a pixel size.
Is it taking a cue from somewhere else? Where can I find & edit it?
TIA
|
#16
Mar 16, 2010, 05:29 AM
|
|
|
|
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
|
|
if you look at the generated source of your page nad find the post you will see this (I've fixed the indenting)
HTML Code:
<div class="post-1 post hentry category-uncategorized" id="post-1">
<div class="post-headline">
<h2>
<a href="http://www.petsintheclassroom.org/blog/?p=1" rel="bookmark" title="Permanent Link to Our new blog!">
Welcome to Pets in the Classroom!
</a>
</h2>
</div>
<div class="post-bodycopy clearfix">
<p>This is our official blog to help you learn more about the Pets in the Classroom program.</p>
</div>
<div class="post-footer">
March 11th, 2010 | Category:
<a href="http://www.petsintheclassroom.org/blog/?cat=1" title="View all posts in Uncategorized" rel="category">
Uncategorized
</a> |
<a href="http://www.petsintheclassroom.org/blog/?p=1#comments" class="comments-link" title="Comment on Our new blog!">
4 comments
</a>
</div>
</div><!-- / Post -->
so you can see that your post title 'Welcome to Pets in the Classroom!' is part of the link (<a..>) so you could use
to assign CSS to it, but every other link would also be effected. The <a> is an element in a n <h2> so you could use 'h2' or 'h2 a' (to be more specific) but the same problem applies - all <a> in an <h2> would be effected. but you also have a <div class="post-headline"> so you can be very specific and code teh CSS Selector as 'div.post-headline h2 a {....}' so it will only effect a LINK that is in an H@ that is in a DIV with a CLASS of 'post-headline'.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
|
#17
Mar 18, 2010, 06:33 PM
|
|
I noticed that the default header title was given a percentage instead of a pixel value (240%).
Meaning that it is 240% of the link CSS?
I might have to change this back to a percentage if this is the case. Just trying to understand the hierarchy with my limited skills.
Thanks for your help.
|
|