11 replies [Last post]
oneeezy
oneeezy's picture
Offline
Enthusiast
Beaumont, TX
Last seen: 10 weeks 2 days ago
Beaumont, TX
Timezone: GMT-5
Joined: 2009-11-18
Posts: 98
Points: 128

Ok, I'm editing a phpbb website right now, please have a look: www.phone7forum.com

My problem is I'm building a liquid layout (when you expand the window the div tags expand as well..) It has a sidebar and main content section. The sidebar is a fixed width and main content area is expandable. So my problem is I have the sidebar floated to the left and the content floated to the left hoping they will line up side by side but they do not.. and I can't add a fixed width to the content because it will not be expandable anymore.. and when i add a percentage for width it works for a second but then when window expands down it will "return" to the bottom. This would be an easy fix but because I have to work with phpbb it changes things up a bit. So I guess Im stuck and out of ideas at this point. And thats when i come here! So guys, if you know what I should do please let me know..

Thanks!
Justin

http://oneillwebs.com/ ~ yes, my personal website built purely with tables which needs to be updated heavily Wink

(before i knew anything!)

Ed Seedhouse
Ed Seedhouse's picture
Offline
Guru
Victoria British Columbia
Last seen: 27 weeks 2 days ago
Victoria British Columbia
Timezone: GMT-7
Joined: 2005-12-14
Posts: 3570
Points: 675

First, you need to clear up

First, you need to clear up those html errors.

With a two column design the easiest way is to float only one column. Use margins on the largest column to make room for the floated one. The default of a block element is to expand to the width of it's parent.

So example, for a sidebar on the left you would put the code for first in the html markup, and set it to a fixed with in CSS, and float it left. Then give the main column a left margin slightly wider than your sidebar.

The beauty of this is that you can change it to a right sidebar simply by changing the CSS, with no alterations to the html.

But clear up those html errors, otherwise this might not work properly.

Ed Seedhouse

Posting Guidelines

Watch out! I am carrying irony, sarcasm and satire, and know how to use them.

oneeezy
oneeezy's picture
Offline
Enthusiast
Beaumont, TX
Last seen: 10 weeks 2 days ago
Beaumont, TX
Timezone: GMT-5
Joined: 2009-11-18
Posts: 98
Points: 128

Hey ed, Thats exactly what

Hey ed,
Thats exactly what I've done now. The left sidebar is floated left and the main content has a margin-left of like 350px to push it past the sidebar. Everything seemed to be working fine until i started adding in the forum code inside my custom div boxes. I think it has something to do w/ the css that came in the pre-made forum but im not completly sure.. What its doing is taking the content of whats inside the forum divs and expanding it all the way down until it gets to the end of the sidebar.., then it shows more content.

Take a look at this:
http://www.phone7forum.com/viewtopic.php?f=2&t=4
http://www.phone7forum.com/viewforum.php?f=2
(and this is only on 2 pages.., there are more like this)

The first link shows the post expanding all the way down to the end of the sidebar and then the other 2 posts are listed under that.. and the 2nd link has the bg color expanding all the way down..Do you think this is clear:both misused somewhere? What do you think the problem is?

This is what I'm trying to achieve:
1st Link - Desired Effect
2nd Link - Desired Effect

http://oneillwebs.com/ ~ yes, my personal website built purely with tables which needs to be updated heavily Wink

(before i knew anything!)

Ed Seedhouse
Ed Seedhouse's picture
Offline
Guru
Victoria British Columbia
Last seen: 27 weeks 2 days ago
Victoria British Columbia
Timezone: GMT-7
Joined: 2005-12-14
Posts: 3570
Points: 675

oneeezy wrote: Take a look at

These pages still have many html errors in them. You were asked to fix them, but you've ignored this apparently.

So, if you aren't willing to follow my advice I don't feel like digging into this any further. Perhaps someone else will, but not me.

Ed Seedhouse

Posting Guidelines

Watch out! I am carrying irony, sarcasm and satire, and know how to use them.

oneeezy
oneeezy's picture
Offline
Enthusiast
Beaumont, TX
Last seen: 10 weeks 2 days ago
Beaumont, TX
Timezone: GMT-5
Joined: 2009-11-18
Posts: 98
Points: 128

sorry about that.., I went

sorry about that.., I went back and fixed every error that I created. The other errors you see are from the "prosilver" style that phpBB provides as its default layout... I wish that they did have a validated version, that would be nice. I had missed a few closing div tags that i fixed up and I got the errors found on the index page from 27 down to 5. Those 5 consist of ul tags that "dont" have li's in them.., which is not true, their are "if statements" inside them that the index page can't pickup. and the other errors are for search fields id's that are called to many times throughout the page, but if i was to go tinker with that it could throw the rest of the search boxes throughout the site off.

Now, the main errors on this page which are 14:
http://www.phone7forum.com/viewtopic.php?f=2&t=4

Are produced by a combo of the errors mentioned above and this avatar image code.., and im not even sure where thats located or where to fix it.

<a href="./memberlist.php?mode=viewprofile&amp;u=2"><img src="./download/file.php?avatar=2_1291357597.jpg" width=80px"265" height=78px"259" alt="User avatar" /></a><br />

I am trying to make this thing work right the best that I can.., I don't want you to think I'm trying to cut any corners... Not how I like to work. I would REALLLY like to figure out why my layout is doing what it's doing though and returning the content all the way down to the sidebar before it starts. Been stuck trying to figure out this problem for about 4 days now....

http://oneillwebs.com/ ~ yes, my personal website built purely with tables which needs to be updated heavily Wink

(before i knew anything!)

Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 5 weeks 1 day ago
Timezone: GMT-5
Joined: 2009-10-09
Posts: 2037
Points: 2259

oneeezy wrote:sorry about

oneeezy wrote:

sorry about that.., I went back and fixed every error that I created. The other errors you see are from the "prosilver" style that phpBB provides as its default layout... I wish that they did have a validated version, that would be nice. ...

You're in luck. It validates out of the box: http://validator.w3.org/check?uri=http%3A%2F%2Fwww.phpbb.com%2Fcommunity%2Findex.php&charset=%28detect+automatically%29&doctype=Inline&group=0

Oneeezy, I'm not sure I understand what the issue is. If it's the part where the second entry is below the sidebar that's because of the clear: both; here:

span.corners-bottom {
	background-image: none;
	background-position: 0 100%;
	margin: 0 -5px;
	clear: both;
}

Found here: http://www.phone7forum.com/style.php?id=1&lang=en

oneeezy
oneeezy's picture
Offline
Enthusiast
Beaumont, TX
Last seen: 10 weeks 2 days ago
Beaumont, TX
Timezone: GMT-5
Joined: 2009-11-18
Posts: 98
Points: 128

ah! ha i donoo but now i

ah! ha i donoo but now i really want to figure it out.... I did mess around with some avatar code in the core files.. err i dont think i did anything wrong but i will check deeper into it.

Ok, these are the 2 problem pages (there are more throughout the site tho)
http://www.phone7forum.com/viewforum.php?f=2
http://www.phone7forum.com/viewtopic.php?f=2&t=4

these are screen shots of the 2 links above, im not sure what there looking like in your browser but this is what i see:
http://phone7forum.com/images/1st_page_wrong.jpg
http://phone7forum.com/images/2nd_page_wrong.jpg

and here's how they should look, or what I'm trying to do (compliments of photoshop):
http://phone7forum.com/images/1st_page_right.jpg
http://phone7forum.com/images/2nd_page_right.jpg

I just tried to remove the clear: both in the:

"span.corners-bottom"

but so far no luck :/

http://oneillwebs.com/ ~ yes, my personal website built purely with tables which needs to be updated heavily Wink

(before i knew anything!)

oneeezy
oneeezy's picture
Offline
Enthusiast
Beaumont, TX
Last seen: 10 weeks 2 days ago
Beaumont, TX
Timezone: GMT-5
Joined: 2009-11-18
Posts: 98
Points: 128

oh! i take that back! it did

oh! i take that back! it did work i guess my refresher wasnt working... now it did some crzzy stuff... hmmmmm

http://oneillwebs.com/ ~ yes, my personal website built purely with tables which needs to be updated heavily Wink

(before i knew anything!)

Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 5 weeks 1 day ago
Timezone: GMT-5
Joined: 2009-10-09
Posts: 2037
Points: 2259

oneeezy wrote:... I just

oneeezy wrote:

... I just tried to remove the clear: both in the:

"span.corners-bottom"

but so far no luck :/

You probably don't want to do that unless you want to rewrite the whole thing. Try to contain the content on the right and float that left then the clear may not affect it that way.

Compare these two:
http://feelerdealer.com/floatClear.html
http://feelerdealer.com/floatClear2.html

oneeezy
oneeezy's picture
Offline
Enthusiast
Beaumont, TX
Last seen: 10 weeks 2 days ago
Beaumont, TX
Timezone: GMT-5
Joined: 2009-11-18
Posts: 98
Points: 128

Verschwindende, That whenever

Verschwindende,
That whenever i started making the site a big question in my head was to make fixed or liquid.., so my whole setup is liquid layout, if i was to float the main content left instead of having the margin pushing it out past the sidebar, wouldnt that effect my entire layout and make it unable to expand correctly? or is there a way around that?

http://oneillwebs.com/ ~ yes, my personal website built purely with tables which needs to be updated heavily Wink

(before i knew anything!)

Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 5 weeks 1 day ago
Timezone: GMT-5
Joined: 2009-10-09
Posts: 2037
Points: 2259

Ah, the liquid design escaped

Ah, the liquid design escaped me. You may have to rethink the content section to not include the clear: both; I'm not sure why you're using it.

oneeezy
oneeezy's picture
Offline
Enthusiast
Beaumont, TX
Last seen: 10 weeks 2 days ago
Beaumont, TX
Timezone: GMT-5
Joined: 2009-11-18
Posts: 98
Points: 128

Thats what im thinking..,

Thats what im thinking.., looks like ill have to re-write the whole thing. sounds like some fun! haha.. and that clear:both wasn't mine.. it was in the forum when i got it. theres all kinds of obstacles like that in there!.., but im very greatful you helped me pin-point the problem. I'll be getting to work on it in a little bit to see if i can't re-design that thing. Will let you guys know the outcome Wink

~ Justin

http://oneillwebs.com/ ~ yes, my personal website built purely with tables which needs to be updated heavily Wink

(before i knew anything!)