Zophar's Message Domain

Go Back   Zophar's Message Domain > General Chat > Talk of the Town

Reply
 
Thread Tools Display Modes
Old 07-09-2004, 05:56 PM   #11
Ugly Joe
Senior Member
 
Ugly Joe's Avatar
 
Join Date: Dec 2003
Posts: 1,461
Default Re: CSS Help

Oh, okay. The 'float' attribute will try and position to the left or right, but will jump to the next line if it can't fit. I didn't try my previous chunk of code with lots of content, so it looked right for me. If you define widths for the divs, it should work (unless you have an image or some such that makes one or the other larger than it should be). I also had to change one of the 'clear' attributes (this one says that when it floats, it wants to have no other content to its left and/or right, depending on what it's set to). Try this:

<div style="float: left; width: 40%;">Upper-Left</div>
<div style="float: right; width: 60%">Upper-Right</div>
<div style="float: left; clear: both; width: 40%">Lower-Left</div>
<div style="float: right; width: 60%">Lower-Right</div>

<P ID="signature"></P>
__________________
Ugly Joe is offline   Reply With Quote
Old 07-09-2004, 06:19 PM   #12
SwampGas
Senior Member
 
Join Date: Apr 2000
Posts: 6,915
Default Re: CSS Help

Didn't change anything.

<P ID="signature"><marquee direction=right scrollamount=10></marquee></P>
SwampGas is offline   Reply With Quote
Old 07-09-2004, 06:39 PM   #13
cipher
Senior Member
 
Join Date: May 2001
Posts: 1,034
Default Re: CSS Help

Did this really fast, and it looks right in Firefox. Should try IE I guess, but eh.

Yep, looks good in IE too.

I hate your POS boards, btw. Keep fucking up & codes.

Look two posts down for HTML.

<P ID="signature">-----
ciphz0r</p><P ID="edit"><FONT class="small">Edited by cipher on 07/09/04 02:43 PM.</FONT></P>
cipher is offline   Reply With Quote
Old 07-09-2004, 06:41 PM   #14
Ugly Joe
Senior Member
 
Ugly Joe's Avatar
 
Join Date: Dec 2003
Posts: 1,461
Default Re: CSS Help

Odd. Ok, floats don't seem to be working for you. Give this a try:

&lt;div style="position: relative; height: 100%;"&gt;
&lt;div style="width: 40%; position: absolute; left: 0px; top:0px;"&gt;top-left&lt;/div&gt;
&lt;div style="width: 60%; position: absolute; right: 0px; top: 0px;"&gt;top-right&lt;/div&gt;
&lt;div style="width: 40%; position: absolute; left: 0px; bottom: 0px;"&gt;bottom-left&lt;/div&gt;
&lt;div style="width: 60%; position: absolute; right: 0px; bottom: 0px;"&gt;bottom-left&lt;/div&gt;
&lt;/div&gt;

<P ID="signature"></P>
__________________
Ugly Joe is offline   Reply With Quote
Old 07-09-2004, 06:42 PM   #15
cipher
Senior Member
 
Join Date: May 2001
Posts: 1,034
Default Re: CSS Help

Fuck it, repost.

&lt;html&gt;
&lt;style&gt;

div.top { background: blue; }
div.mid { background: red; text-align: center; }

div.tr { background: grey; float: left; width: 50%; }
div.tl { background: yellow; float: right; width: 50%; }
div.br { background: pink; float: left; width: 50%; }
div.bl { background: purple; float: right; width: 50%; }

span.header { background: green; vertical-align: middle; }

img.header { vertical-align: middle; width: 200px; height: 50px }

&lt;/style&gt;
&lt;body&gt;

&lt;div class="top"&gt;
&lt;img class="header"&gt;
&lt;span class="header"&gt;OMG THIS IS TEXT IN THE HEADER!!! &lt;/span&gt;
&lt;/div&gt;

&lt;div class="mid"&gt;
OMG CENTER
&lt;/div&gt;

&lt;div class="tr"&gt;Top Left&lt;/div&gt;
&lt;div class="tl"&gt;Top Right&lt;/div&gt;
&lt;div class="br"&gt;Bottom Left &lt;/div&gt;
&lt;div class="bl"&gt;Bottom Right&lt;/div&gt;

&lt;/body&gt;
&lt;/html&gt;


<P ID="signature">-----
ciphz0r</P>
cipher is offline   Reply With Quote
Old 07-09-2004, 07:09 PM   #16
SwampGas
Senior Member
 
Join Date: Apr 2000
Posts: 6,915
Default Re: CSS Help

Now it's at the top of the page covering the header that we just got working.

<P ID="signature"><marquee direction=right scrollamount=10></marquee></P>
SwampGas is offline   Reply With Quote
Old 07-09-2004, 07:17 PM   #17
Ugly Joe
Senior Member
 
Ugly Joe's Avatar
 
Join Date: Dec 2003
Posts: 1,461
Default Re: CSS Help

> Now it's at the top of the page covering the header that we
> just got working.
>
Hmm...this is what I've got:
<a href=http://www.ximwix.net/storage/test1.htm>http://www.ximwix.net/storage/test1.htm</a>

That works for me in FireFox and in IE, except that it forces scrollbars all the time (which i could fix in FireFox, but not IE). If you know the exact dimensions of the header or anything else, this could be a lot easier. If not, I am fresh out of ideas.

<P ID="signature"></P><P ID="edit"><FONT class="small">Edited by Ugly Joe on 07/09/04 03:19 PM.</FONT></P>
__________________
Ugly Joe is offline   Reply With Quote
Old 07-09-2004, 08:51 PM   #18
Alevice
Regular Member
 
Join Date: Feb 2004
Posts: 94
Default Re: CSS Help

> Didn't change anything.
>
Not sure if it will work, but try adding 'display: inline;'. There is a chances each is treated like a block (just like a div and paragraph do) rather than an inline element.

Haven't tried the whole code yet.

<P ID="signature">_-|-_</P>
Alevice is offline   Reply With Quote
Reply

Thread Tools
Display Modes

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. The time now is 02:36 AM.

Contact Us - Zophar's Domain - Archive - Top

Powered by vBulletin® Version 3.8.4
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.