-
1. Re: DW CS 4 Layout Question
Nancy O. Dec 24, 2011 10:46 AM (in response to pcford)Divide your footer into 2 elements and use floats to make them site side by side.
#footer1 {
float:left;
width: 40%;
text-align:left;
border: 1px dotted red; /**for demo purposes**/
}
#footer2 {
float:right;
width:40%;
text-align:right;
border: 1px dotted gold; /**for demo purposes**/
}
HTML:
<div id="footer1">
<p>Here is footer1 text </p>
</div>
<div id="footer2">
<p><img src="some-image.jpg"> <br>
Caption below image </p>
</div>
❄ ☃ ❄
Season's Greetings
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
-
2. Re: DW CS 4 Layout Question
pcford Dec 25, 2011 1:16 PM (in response to Nancy O.)Well, thanks, I appreciate the help...however:
I want the two text taglines aligned left and right and on the same line. I want the footer image to be above the right hand aligned text.
Your formulation has the text on two different lines with the image above the right hand text.
I put the image in a div and right aligned it but it goes under the right hand text...it is likely I am not understanding something basic. Thanks for any help.
-
3. Re: DW CS 4 Layout Question
Nancy O. Dec 26, 2011 10:14 AM (in response to pcford)You can use margins and padding to align text where needed.
For better answers, please post a link to your test page.
Or as a less preferable 2nd choice, paste your HTML and CSS code into a reply in the web forum.
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
-
4. Re: DW CS 4 Layout Question
pcford Dec 26, 2011 10:33 AM (in response to Nancy O.)Ok, Nancy, thanks again for your help...I have use padding and margins but when I do, the image will not stay above the text line. Maybe it's inheiriting something? Dunno.
As you suggest, later today I will get more concrete examples to show you...thanx again. pcf
-
5. Re: DW CS 4 Layout Question
pcford Dec 26, 2011 2:07 PM (in response to pcford)Here ya go:
I changed your html to get text on same line but then the image goes below...as it goes with my efforts.
1000px box hold:
html:
<!--FOOTER--> <div><img src="images/footer_icon.gif" width="54" height="96" vspace="100" align="right"></div> <div id="footer1">
<p>Here is footer1 text </p>
</div>
<div id="footer2">
Caption below image </p>
</div>
CSS as your suggestions:
#footer1 {
float:left;
width: 40%;
text-align:left;
border: 1px dotted red; /**for demo purposes**/
}
#footer2 {
float:right;
width:40%;
text-align:right;
border: 1px dotted gold; /**for demo purposes**/
}
-
6. Re: DW CS 4 Layout Question
Nancy O. Dec 26, 2011 3:01 PM (in response to pcford)I can't tell much from what you posted.
Is this close to what you want? (view source in browser to see the code)
http://alt-web.com/TEST/Floated-Footer.html
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists


