Ok, so im making a wordpress layout. Everything is working well but my main content float and sidebar float. For some reason All my Blog posting are posting horiztonal and not vertical?? The post are in main-col which is float: left but they stretch across and push my sidebar which float:right down?
A image is attach to see what i mean: (would link but working on home server) the advertisement image is in my sidebar just so you know.
[attachment=0]example.jpg[/attachment]
I put the php code on index file between divs with id of main-col
and put the image inbetween div's on sidebar.php id: sidebar.
here is my css code:
/* ARTHUR: Chris Cardarello www.moppieillusions.com
Ok, so i added a .post class with same width as main-col and in set post vertical just with no space between each other but, my sidebar is still at bottom of page? I even try'd to float the post class left but can't get the sidebar along side it up top.
Ok i got it fixed for now lol, um one question though my buttons have three state the third is a clicked state, how do you make it so once clicked and it goes to page it stays on clicked state?
Ok along with my question above^^ I have another, in FireFox, and Chrome the advertisement image is at top right of body, but in IE its not anyway to fix? and in Chrome my dropshadow works for the blog post h2, but not in FireFox or IE, anyway of getting it too work in those?
Ok i got it fixed for now lol, um one question though my buttons have three state the third is a clicked state, how do you make it so once clicked and it goes to page it stays on clicked state?
If you are using the Wordpress list pages function it will add the class of "current_page_item" so just apply the "clicked" background image to that class.
Does that make sense?
"quickfire84" said:
Ok along with my question above^^ I have another, in FireFox, and Chrome the advertisement image is at top right of body, but in IE its not anyway to fix?
Oh dear. :? Non validating html aside your page structure is totally screwed up. The sidebar needs to be inside the #wrap-content div and all of the posts should be inside the #main-col div and not just the first one.
Wow, lol sorry i should of done that don't know why i didn't but now all post and side bar are inside the wraps, but now if you look the ads image is in correct side just not at top.
Nevermind!!!! i got it!! lol thank you, oh i have another question.. i never made a three state button, so how do i add that clicked state too it ? just like i did hover?
Oh and how do i get a line break between post is that somewhere in settings?
I would have used wp_list_pages or the new wp_page_menu to create my nav, that way all the neccessary classes are added dynamically. By hard coding the navigation you will have to use something like this http://www.problogdesign.com/wordpress/get-total-control-over-your-page-styles-with-css/
Yea that worked thank you, i got one last thing hopefully i dunno if i can do it but.. you kno how the white fades out from the nav ? well my footer is the same way, but i was try'ing to se if there is anyway i can get the text to overlap it and go almost to the end of the white, instead of leaving all that empty space?? but also in IE the footer overlaps the bottom post and if you goto services page it kinda hangs there in middle, i used the sticky footer settings so must be doing something wrong lol.
Oh one last thing lol, how can i get that copyright at the bottom between the end of white and browser bottom i try'd padding and margin-top but no luck...
Start by validating your html http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fmoppieillusions.com%2F and then your css http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=http%3A%2F%2Fmoppieillusions.com%2F. Then we might be able to see where we are.
Ok my HTML validates, and my css only get 2 of which are because they are CSS3, the sticky footer setting !important and another one that i dunno why it says its a error cause its not Parse Error : left; } /*bgfader image settings*/ div#bg-content dont understand that? but other then those css is fine so i dunno what making it do that in IE..
That should be a semi-colon after !important. Fix that and I'm pretty sure that the last error will disappear as well.
Not sure I understand what else you are trying to do. I certainly wouldn't have fixed heights all over the place, the page needs to be able to grow with new content.
I would also position the copyright at the bottom of the page and get rid of all that padding before it comes back to haunt you.
Ok thank you, well how can i put it at the bottom? What im trying to do is fix it in IE forsome reason the bottom fade overlaps the posting. And i was trying to figure out a way to make it so the text from the content can come down into the white part of the footer so there isnt all that negative space.
I don't see any fade on the bottom? Use absolute positioning for the copyright. It's not possible to get your content into the footer the way you have it set up. You should probably look at the sliding doors technique and then go back into photoshop.
Ok sorry for not know but im new to using css i use to only use it for links and font and font color, i looked up the sliding door effect and the only thing i can find on it is rounding buttons and stuff.
...the only thing i can find on it is rounding buttons and stuff.
Yep. I recommend reading about that.
If you learn how those buttons work, you'll see how you create the CSS once, and it can be used on any width button because of the "sliding door" background image.
A image is attach to see what i mean: (would link but working on home server) the advertisement image is in my sidebar just so you know.
[attachment=0]example.jpg[/attachment]
I put the php code on index file between divs with id of main-col
and put the image inbetween div's on sidebar.php id: sidebar.
here is my css code:
heres line finally got it live: http://moppieillusions.com/
If you are using the Wordpress list pages function it will add the class of "current_page_item" so just apply the "clicked" background image to that class.
Does that make sense?
I'd start with validating your HTML: http://validator.w3.org/check?verbose=1 ... ons.com%2F
and your CSS: http://jigsaw.w3.org/css-validator/vali ... ons.com%2F
That drop shadow is part of CSS 3, and not viewable in most people's browser.
Non validating html aside your page structure is totally screwed up.
The sidebar needs to be inside the #wrap-content div and all of the posts should be inside the #main-col div and not just the first one.
Oh and how do i get a line break between post is that somewhere in settings?
What line break?
Think i have to link the whole url of this image in the sidebar.php instead of just images/ thats what ill try and see if it works
Thanks for all the help...
Yes, use absolute linking (start with a backslash to tell it) to start from the root of the website
Oh one last thing lol, how can i get that copyright at the bottom between the end of white and browser bottom i try'd padding and margin-top but no luck...
Not sure I understand what else you are trying to do. I certainly wouldn't have fixed heights all over the place, the page needs to be able to grow with new content.
I would also position the copyright at the bottom of the page and get rid of all that padding before it comes back to haunt you.
Use absolute positioning for the copyright.
It's not possible to get your content into the footer the way you have it set up. You should probably look at the sliding doors technique and then go back into photoshop.
Yep. I recommend reading about that.
If you learn how those buttons work, you'll see how you create the CSS once, and it can be used on any width button because of the "sliding door" background image.
It's a very useful technique.
The priciple is the same whether it's a horizontal button or a vertical div.