RE: FN-FORUM: CSS Help Please

date posted 15th November 2007 21:27

Hello

Just saw your post, even though you say it now works, in ie7 and ff2 it
still looks bad, text overlaps on the right and the light bulb top is the
only bit of that img showing.

Just had a play around using firebug and i can get it to work after
adjusting the html and css a bit in ur top, middle and bottom divs, also
your body_text div. Then also moved your lightbulb to the bottom div and
changed that css too. Ive also had to add two new divs for centering on
screen, see below for the full code, compare with what you currently have
and see where ive made changes:

----html begin------



content2














text here grgw ewgf wegewg rewgrewgtre grgre gr reg regreg regre gr
rgre re 123456789
trhetrh
hreh
rehreh












---html end----

---css begin---

body {
width: 100%;
margin-right: auto;
margin-left: auto;
margin-top: 50px;
padding:0px;
text-align:center;
background-color:#FFFFFF;
}

#page
{
width: 100%;
height: auto;
display: block;
margin-left: auto;
margin-right: auto;
text-align: center;
}

#container
{
width: 817px;
height: auto;
display: block;
margin-left: auto;
margin-right: auto;
text-align: center;
}

.centred {
height: 476px;
width: 817px;
margin-left: auto;
margin-right: auto;
text-align:left;
}

.centred-undertext {
height: 1px;
width: 1px;
margin: 0px auto;
text-align:left;
overflow:scroll;

}
.master_hold
{
width:817px;
height:50px;
margin: 0px auto;
text-align:left;
overflow:visible;
}

.top_block {
width:817px;
margin-left: auto;
margin-right: auto;
text-align:left;
display: block;
float: left;
}

.middle_block {
width:817px;
margin-left: auto;
margin-right: auto;
text-align:left;
background-image:url(images/content2_11.gif);
float: left;
display: block;
}

.body_text{
width: 460px;
text-align:left;
margin-top: -71px;
margin-left: 300px;
padding-bottom: 10px;
margin-bottom: 15px;
overflow:visible;
}

.fish{
width:207px;
text-align:left;
border-width:0px;
position: absolute;
top: 75px;
left: 165px;
}

.bottom_block{
width:817px;
margin-left: auto;
margin-right: auto;
text-align:left;
display: block;
float: left;
}

.btn_services{
border-width:0px;
}

.btn_home{
border-width:0px;
}

.btn_portfolio{
border-width:0px;
}

.btn_aboutus{
border-width:0px;
}

.btn_contactus{
border-width:0px;
}

---css end---

HTH

Martin




----- Original Message -----
From: "Phillip Healey" [EMAIL REMOVED]
To: [EMAIL REMOVED]
Sent: Thursday, November 15, 2007 3:24 PM
Subject: RE: SPAM-LOW: RE: FN-FORUM: CSS Help Please



> Just add position: relative; to #top_block but causes additional breakage
in
>IE which isn't present in FF, but I'm sure that can be fixed.

Seems to work fine in both IE & FF, now!

Thanks for the suggestion. What problems did you encounter in IE Colin?

Regards
Phill Healey
Munklefish
Po Box 70
Manchester
M34 3SQ
T: 0161 408 4759



-----Original Message-----
From: [EMAIL REMOVED] [EMAIL REMOVED] On Behalf Of Colin
Shipton
Sent: 15 November 2007 15:17
To: FN-FORUM / [EMAIL REMOVED]
Subject: SPAM-LOW: RE: FN-FORUM: CSS Help Please


> Ive tried different positions and bits of css to try and rectify this
without success. Can anyone shed some light on resolving this at all? Any
help would be greatly appreciated..

Just add position: relative; to #top_block but causes additional breakage in
IE which isn't present in FF, but I'm sure that can be fixed.

--
Colin Shipton | Intrafusion Limited
www.intrafusion.co.uk





--
Freelancers, contractors earn more with Prosperity4
Call 0870 870 4414 or visit www.prosperity4.com
and benefit from Inland Revenue approved expenses today.

To advertise here: http://www.freelancers.net/advertising.html


--
Freelancers, contractors earn more with Prosperity4
Call 0870 870 4414 or visit www.prosperity4.com
and benefit from Inland Revenue approved expenses today.

To advertise here: http://www.freelancers.net/advertising.html