Sign In
Create Account
Follow Us on Twitter
Subscribe on Youtube
2
Well its me AGAIN so anyway in my current site's title bar there are two logos then the links. Having re-sized the HUGE images (like 1200X670) I discovered that the images pushed the text to their bottom.
<logo1><logo1><logo2><logo2>
<logo1><logo1><logo2><logo2> **< Over here (probably nice and big :) )**
<logo1><logo1><logo2><logo2> This text is meant to be ^^
I bet Joomla screwed up my nice little diagram :crying:
Thanks in advanced Roast
2 replies to this topic
#1
Posted 20 March 2011 - 09:43 PM
bbqroast
-
- Members
-
- 554 posts
Codecall Addict
- Location:/etc/passwd
Please, write clearly with proper structure. Double spacing makes the text feel un-jointed, Capitalizing Every Word Means People Stop Before Every Word Sub-Consciously Which Is A Pain In The Backside, and use code tags! (The right most styling box).
Back to top|
|
|
#2
Posted 27 April 2011 - 10:32 PM
sharma
-
- Members
-
- 1 posts
Newbie
Wrapping text around an image is easy when using the CSS Float attribute. You have a choice to either float the picture to the left or to the right and the rest is done for you. Below is an example of an image that is floated to different sides of a paragraph.
CSS Code:
Display:
The images are contained within the paragraph tag. The image has floated to the left, and also to the right because we have used both types of image floating in this example. Notice how the text wraps around the images quite nicely. The images are contained within the paragraph tag. The image has floated to the left, and also to the right because we have used both types of image floating in this example. Notice how the text wraps around the images quite nicely.
This second paragraph has an image that is floated to the right. It should be noted that a margin should be added to images so that the text does not get too close to the image. There should always be a few pixels between words and borders, images, and other content. This second paragraph has an image that is floated to the right. It should be noted that a margin should be added to images so that the text does not get too close to the image. There should always be a few pixels between words and borders, images, and other content.
CSS Code:
img.floatLeft {
float: left;
margin: 4px;
}
img.floatRight {
float: right;
margin: 4px;
}
HTML Code:<body> <img src="sunset.gif" class="floatLeft"> <p>The images are contained with...</p> <img src="sunset.gif" class="floatRight"> <p>This second paragraph has an...</p> </body>
Display:
The images are contained within the paragraph tag. The image has floated to the left, and also to the right because we have used both types of image floating in this example. Notice how the text wraps around the images quite nicely. The images are contained within the paragraph tag. The image has floated to the left, and also to the right because we have used both types of image floating in this example. Notice how the text wraps around the images quite nicely.
This second paragraph has an image that is floated to the right. It should be noted that a margin should be added to images so that the text does not get too close to the image. There should always be a few pixels between words and borders, images, and other content. This second paragraph has an image that is floated to the right. It should be noted that a margin should be added to images so that the text does not get too close to the image. There should always be a few pixels between words and borders, images, and other content.
#3
Posted 20 May 2011 - 04:17 PM
bbqroast
-
- Members
-
- 554 posts
Codecall Addict
- Location:/etc/passwd
...
Doesn't that just push the image to one size of the text??
I want something like this:
Doesn't that just push the image to one size of the text??
I want something like this:
XXXXXXX
Text Here XXXXXXX
XXXXXXX
Where the XXXX is the image, as you can see the text is being pushed to the middle of it vertically, I actually found some CSS code for this:<img align=middle src='/includes/images/logo.png'>But that keeps the text in the same place and moves the image :( so basically you have a DIV with an image poking through the bottom...
Please, write clearly with proper structure. Double spacing makes the text feel un-jointed, Capitalizing Every Word Means People Stop Before Every Word Sub-Consciously Which Is A Pain In The Backside, and use code tags! (The right most styling box).
1 user(s) are reading this topic
0 members, 1 guests, 0 anonymous users
