473,516 Members | 3,355 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Positioning H2/IMG/UL in CSS

I'm trying to arrange an item
consisting of a H element across the page width,
with an unordered list below on the left, and an image below on the right.
I want to repeat this so I have each item below the previous
H1
UL IMG
H1
UL IMG
H1
UL IMG
......
or
H1
UL
IMG
H1
UL
IMG if page reduced in width

I want each H1/UL/IMG to remain together.

But H always across the top of the group, UL to the left, IMG to the right
if enough width, else below

I've tried loads of ways to use div/span and display inline/block to try to
get this but I'm obviously not understanding CSS.
I could do it with a table easily, but I would like to use CSS ?
Regards
Tony
Apr 3 '07 #1
1 2372
On Tue, 3 Apr 2007, Tony B wrote:
I'm trying to arrange an item consisting of a H element across the page
width, with an unordered list below on the left, and an image below on
the right. I want to repeat this so I have each item below the previous
H1
UL IMG
H1
UL IMG
H1
UL IMG
.....
or
H1
UL
IMG
H1
UL
IMG if page reduced in width

I want each H1/UL/IMG to remain together.

But H always across the top of the group, UL to the left, IMG to the right
if enough width, else below
I'm not totally sure I understand what you want, but it sounds like you
should say float:left on the ULs, then clear:left (or clear:both) on the
H1s. Is that not what you have in mind?

-Christopher
Apr 3 '07 #2

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

9
32028
by: Bryan R. Meyer | last post by:
Hello Everyone, The problem of browser resizing has become an issue for me. While redesigning my webpage, I set the left and right margins to be auto so that my content would be centered. However, there are images that I used absolute positioning in order to place them in the appropriate location on my page. When I do a browser resize,...
4
2688
by: Jane Withnolastname | last post by:
I am trying to re-work an old site by replacing the html with css. On the main page, I have a logo image which I needed centred on the initial screen. I found the solution here: http://www.wpdfd.com/editorial/wpd0103.htm#toptip (the second example) The problem is, under the image is a large table. But using the above positioning, now the...
14
2451
by: Harlan Messinger | last post by:
What am I not understanding about the definition of { position: absolute; }? "The box's position (and possibly size) is specified with the 'left', 'right', 'top', and 'bottom' properties. These properties specify offsets with respect to the box's containing block." Please take a look at http://gavelcade.com/abspos.html and help me...
6
2664
by: rajek | last post by:
I posted a similar question yesterday, but didn't get an answer that resolved the issue. (Thanks to those who tried though.) The background: I've read in books and online that if you have one element with "relative" positioning, such as a <div>, it creates a "positioning context" for element within it. E.g., if you have a <p> inside your...
11
2622
by: NS | last post by:
I am relativly new to css positioning and have a question regarding the display of a DHTML pop-up Here is the basic HTML I am using: <html> <head> <script language="JavaScript"> <!--
1
2795
by: Charles Harrison Caudill | last post by:
with tables there is a clean and algorithmic way to organize things, but with css which is, once you get it working, much cleaner, I have to tweak and patch and hope and pray and curse before things are positioned the way I want them. It *should* be easy to say: this goes on the left, this goes on the right, this goes in the center, all on...
2
2474
by: Rob R. Ainscough | last post by:
I'm slowly (very slowly) working my way thru the bizarre and sadistic world of control positioning in MultiViews (ASP 2.0). I came across this to help me explain (or attempt to anyway) why my web page controls were all over the place. "Ironically, absolute positioning is relative. Yes, you read that right. An absolutely positioned element...
4
2090
by: Alan Silver | last post by:
Hello, Having been a light reader of this ng for a few months now (after several years absence), I have noticed that absolute positioning seems to be considered a Very Bad Thing around here. Generally, when someone posts a question about a design that uses it, they are told not to. Now, in my ignorance, I don't see what's wrong with it,...
9
3372
by: Bill Norton | last post by:
I've been experimenting with floats, positioning and offsets (top, left, etc.) to see what happens when you mix the properties together. All this may be old news to most of you, but it was extremely helpful to me. The results are summarized in this chart. In all these tests I was using a single child element inside a containing block. (I hope...
6
2896
by: Mark | last post by:
hi, i'm trying to position something in the top right corner of a container, but i can't seem to figure out how to get it working. here's the html <div class='thumb'><a href='image.jpg'><img src='photos/thumbs/ bigsmile.jpg'></a><a class='del' href='?p=gallery&del=2'>x</a></div> where 'thumb' is my container, and 'del' should be aligned...
0
7273
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main...
0
7405
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. ...
1
7136
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For...
0
7547
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the...
0
5712
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then...
0
3265
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in...
0
3252
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
0
1620
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
1
823
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.