Go Back   CodingForums.com > :: Client side development > HTML & CSS

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 01-19-2013, 03:28 PM   PM User | #1
charlyanderson
Regular Coder

 
Join Date: Dec 2012
Posts: 111
Thanks: 14
Thanked 1 Time in 1 Post
charlyanderson is an unknown quantity at this point
WP - Can someone help with positioning

Hi I am building a Wordpress site and just need some help positioning some Divs.

the website address is here. I am trying the position the 3 latest news block side by side instead of underneath each other.

Any ideas? Thanks in advance
charlyanderson is offline   Reply With Quote
Old 01-19-2013, 04:38 PM   PM User | #2
COBOLdinosaur
Regular Coder

 
COBOLdinosaur's Avatar
 
Join Date: Jul 2002
Location: Canada
Posts: 299
Thanks: 1
Thanked 18 Times in 18 Posts
COBOLdinosaur is an unknown quantity at this point
First of all there are 5 errors in validation. You should fix those so they don't add to the problem. The very precise width and margin definition are probably messing up the floats. If it is too tight it will break. You need to keep the totals with slightly less then the available space in the container.
__________________
100% standards compliant code is 100% correct 100% of the time.
one of my toys from my repository and perhaps some help getting help

Cd&
COBOLdinosaur is offline   Reply With Quote
Old 01-19-2013, 05:08 PM   PM User | #3
charlyanderson
Regular Coder

 
Join Date: Dec 2012
Posts: 111
Thanks: 14
Thanked 1 Time in 1 Post
charlyanderson is an unknown quantity at this point
thanks, I will double check everything ta
charlyanderson is offline   Reply With Quote
Old 01-19-2013, 05:51 PM   PM User | #4
charlyanderson
Regular Coder

 
Join Date: Dec 2012
Posts: 111
Thanks: 14
Thanked 1 Time in 1 Post
charlyanderson is an unknown quantity at this point
I have fixed all but one error and still cannot get it to work. Even if I ask it to display just two news posts, they stack under each other rather than side by side.
charlyanderson is offline   Reply With Quote
Old 01-19-2013, 06:03 PM   PM User | #5
COBOLdinosaur
Regular Coder

 
COBOLdinosaur's Avatar
 
Join Date: Jul 2002
Location: Canada
Posts: 299
Thanks: 1
Thanked 18 Times in 18 Posts
COBOLdinosaur is an unknown quantity at this point
The three latest news blocks are all inside the same parent which only has a 33% width, and they are not floated and do not have a width.

The parent must be wide enough to hold them. They each must have a width specified. The total width of the three must not be more than the width of the parent block. Each of them must have float:left included in their styles. The parent does not need float:left
__________________
100% standards compliant code is 100% correct 100% of the time.
one of my toys from my repository and perhaps some help getting help

Cd&
COBOLdinosaur is offline   Reply With Quote
Old 01-19-2013, 06:12 PM   PM User | #6
charlyanderson
Regular Coder

 
Join Date: Dec 2012
Posts: 111
Thanks: 14
Thanked 1 Time in 1 Post
charlyanderson is an unknown quantity at this point
Hi thanks for your comment.

I am trying to use the 1140px grid system so I have tried to apply twelvecol to #latest-posts and fourcol to the #latest-post. Problem is im using code someone else gave me so I guess im lacking the understanding of how it was put together
charlyanderson is offline   Reply With Quote
Old 01-19-2013, 06:12 PM   PM User | #7
charlyanderson
Regular Coder

 
Join Date: Dec 2012
Posts: 111
Thanks: 14
Thanked 1 Time in 1 Post
charlyanderson is an unknown quantity at this point
I meant threecol to #latest-post
charlyanderson is offline   Reply With Quote
Old 01-19-2013, 06:18 PM   PM User | #8
COBOLdinosaur
Regular Coder

 
COBOLdinosaur's Avatar
 
Join Date: Jul 2002
Location: Canada
Posts: 299
Thanks: 1
Thanked 18 Times in 18 Posts
COBOLdinosaur is an unknown quantity at this point
This syntax is incorrect:
<div class="latest-post" class="threecol">

As a result threecol does not get applied.

The correct way to specify multiple classes is:
<div class="latest-post threecol">
__________________
100% standards compliant code is 100% correct 100% of the time.
one of my toys from my repository and perhaps some help getting help

Cd&
COBOLdinosaur is offline   Reply With Quote
Users who have thanked COBOLdinosaur for this post:
charlyanderson (01-19-2013)
Old 01-19-2013, 11:08 PM   PM User | #9
charlyanderson
Regular Coder

 
Join Date: Dec 2012
Posts: 111
Thanks: 14
Thanked 1 Time in 1 Post
charlyanderson is an unknown quantity at this point
You are completely right, I should have know better and spotted that doh. Thanks so much for pointing that out, I have now fixed it and it's working. Thank you
charlyanderson is offline   Reply With Quote
Old 01-20-2013, 03:59 PM   PM User | #10
COBOLdinosaur
Regular Coder

 
COBOLdinosaur's Avatar
 
Join Date: Jul 2002
Location: Canada
Posts: 299
Thanks: 1
Thanked 18 Times in 18 Posts
COBOLdinosaur is an unknown quantity at this point
It never hurts to have an extra pair of eyes.
__________________
100% standards compliant code is 100% correct 100% of the time.
one of my toys from my repository and perhaps some help getting help

Cd&
COBOLdinosaur is offline   Reply With Quote
Users who have thanked COBOLdinosaur for this post:
charlyanderson (01-20-2013)
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 08:49 PM.


Advertisement
Log in to turn off these ads.