Today's Posts Follow Us On Twitter! TFL Members on Twitter  
Forum search: Advanced Search  
Navigation
Marketplace
  Members Login:
Lost password?
  Forum Statistics:
Forum Members: 24,254
Total Threads: 80,792
Total Posts: 566,471
There are 1407 users currently browsing (tf).
 
  Our Partners:
 
  TalkFreelance     Design and Development     HTML/XHTML/DHTML/CSS :

CSS layout problem

Thread title: CSS layout problem
Closed Thread    
    Thread tools Search this thread Display Modes  
05-04-2005, 03:02 PM
#1
JusTJusT is offline JusTJusT
JusTJusT's Avatar
Status: I'm new around here
Join date: Jan 2005
Location: Lithuania, Kaunas
Expertise:
Software:
 
Posts: 22
iTrader: 0 / 0%
 

JusTJusT is on a distinguished road

Send a message via Yahoo to JusTJusT

  Old  CSS layout problem

Hi,
I just added two paragraphs to my website http://books.mikrovisata.net/justjust and right hand side layer have droped down in IE, everything is rendered fine on FireFox or Opera. Please take a look and say if you know how to solve the problem

Thanks in advance

05-04-2005, 05:03 PM
#2
opserty is offline opserty
Status: I love this place
Join date: Jan 2005
Location: UK, Birmingham
Expertise:
Software:
 
Posts: 606
iTrader: 0 / 0%
 

opserty is on a distinguished road

Send a message via MSN to opserty

  Old

In the html page try placing the right hand side before the main content I think that might work its happened to me a couple of times. I think that was the solution. Also rightCont can be:

HTML Code:
 .rightCont {
	width: 222px;
	height: auto;
	border-top: 1px solid #333333;
	border-right: 1px solid #333333;
	border-bottom: 1px solid #333333;
	float: right;
}
Much shorter

05-04-2005, 05:24 PM
#3
Lori is offline Lori
Status: I'm new around here
Join date: Jan 2005
Location: South Florida
Expertise:
Software:
 
Posts: 16
iTrader: 0 / 0%
 

Lori is on a distinguished road

Send a message via ICQ to Lori Send a message via AIM to Lori Send a message via MSN to Lori Send a message via Yahoo to Lori

  Old

Agree

05-04-2005, 06:35 PM
#4
JusTJusT is offline JusTJusT
JusTJusT's Avatar
Status: I'm new around here
Join date: Jan 2005
Location: Lithuania, Kaunas
Expertise:
Software:
 
Posts: 22
iTrader: 0 / 0%
 

JusTJusT is on a distinguished road

Send a message via Yahoo to JusTJusT

  Old

Didn't helped, the only changes I can see is that the right-hand layer is in it's place, but the main "text" layer is dumped down now! I even tried to recount all box widht's + padding's*2 + borders widht's there was some mistakes but after fixing them I didn't solve the problem...

Any other ideas?


Originally Posted by opserty
In the html page try placing the right hand side before the main content I think that might work its happened to me a couple of times. I think that was the solution. Also rightCont can be:

HTML Code:
 .rightCont {
	width: 222px;
	height: auto;
	border-top: 1px solid #333333;
	border-right: 1px solid #333333;
	border-bottom: 1px solid #333333;
	float: right;
}
Much shorter

05-04-2005, 07:26 PM
#5
opserty is offline opserty
Status: I love this place
Join date: Jan 2005
Location: UK, Birmingham
Expertise:
Software:
 
Posts: 606
iTrader: 0 / 0%
 

opserty is on a distinguished road

Send a message via MSN to opserty

  Old

Try reducing the width of rightCont to 221px. Make sure you take into account the width of the borders and reduced the main content section by 2px (width)

HTML Code:
 .rightCont {
	width: 221px;
	height: auto;
	border-top: 1px solid #333333;
	border-right: 1px solid #333333;
	border-bottom: 1px solid #333333;
	float: right;
}
.content {
	width: 768px;
	margin-right: auto;
	margin-left: auto;
	padding: 0px;

}

05-05-2005, 04:10 AM
#6
Koobi is offline Koobi
Koobi's Avatar
Status: Member
Join date: Apr 2005
Location:
Expertise:
Software:
 
Posts: 312
iTrader: 0 / 0%
 

Koobi is on a distinguished road

  Old

I don't have time to look at your page right now, sorry, but I have to attend classes in a few minutes...but it sounds like it's IE's buggy Box model

Search google for "IE box model hack" and you should be able to figure it out.


By the way, this:
Code:
.rightCont {
	width: 222px;
	height: auto;
	border-top: 1px solid #333333;
	border-right: 1px solid #333333;
	border-bottom: 1px solid #333333;
	float: right;
}
can be written like this as well:
Code:
.rightCont {
	width: 222px;
	height: auto;
	border: 1px solid #333;
	border-left: none;
	float: right;
}

That should work if I don't have a typo in there somewhere

05-05-2005, 05:01 AM
#7
JusTJusT is offline JusTJusT
JusTJusT's Avatar
Status: I'm new around here
Join date: Jan 2005
Location: Lithuania, Kaunas
Expertise:
Software:
 
Posts: 22
iTrader: 0 / 0%
 

JusTJusT is on a distinguished road

Send a message via Yahoo to JusTJusT

  Old

OK I found the problem, I put a <br> tag in the middle of the Italic style paragraph and it now looks good. Looks like IE could do stupid things even with tags like <EM>...

05-05-2005, 08:28 AM
#8
Julian is offline Julian
Status: Simply to simplify
Join date: Apr 2005
Location: Foxton, Manawatu, New Zealand
Expertise:
Software:
 
Posts: 5,572
iTrader: 0 / 0%
 

Julian is on a distinguished road

  Old

lol @ that crazy IE, it just makes us all smile doesn't it

05-05-2005, 11:04 AM
#9
JusTJusT is offline JusTJusT
JusTJusT's Avatar
Status: I'm new around here
Join date: Jan 2005
Location: Lithuania, Kaunas
Expertise:
Software:
 
Posts: 22
iTrader: 0 / 0%
 

JusTJusT is on a distinguished road

Send a message via Yahoo to JusTJusT

  Old

Originally Posted by Julian
lol @ that crazy IE, it just makes us all smile doesn't it
sometimes it could make us cry I think...

Closed Thread    


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

  Posting Rules  
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump:
 
  Contains New Posts Forum Contains New Posts   Contains No New Posts Forum Contains No New Posts   A Closed Forum Forum is Closed