Re: [css-d] aligning text with right edge of button on the following line
On Sat, Mar 23, 2013 at 1:38 PM, Philip TAYLOR p.tay...@rhul.ac.uk wrote: Based on your code : div style='text-align: right;' Want this right justified above Download button br / input type=submit class=submit name=submit_preview value=Generate/input input type=submit class=submit name=submit_download value=Download/input /div Thanks for the reply. This moves everything to the right. I want the buttons left justified, and the text right justified with the second button. Adding 'float: left' got it to do what I want: div style='float: left; text-align: right;' Want this right justified above Download button br / input type=submit class=submit name=submit_preview value=Generate Report /input input type=submit class=submit name=submit_download value=Download Table /input /div However it had an odd, undesirable side effect. This was just a snippet of the page. This is contained within another div with a bottom border. Without the float: left the text and buttons display above the border as I want it to be and would expect it to be. But when I add the float: left the text displays on top of the border with the buttons below it. See: http://jsfiddle.net/w7BNW/4/ Remove the float: left to see what I mean. Why does the float: left cause this? How can I prevent that from happening? __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] aligning text with right edge of button on the following line
On Sat, Mar 23, 2013 at 2:37 PM, Philip TAYLOR p.tay...@rhul.ac.uk wrote: Larry Martell wrote: Thanks for the reply. This moves everything to the right. I want the buttons left justified, and the text right justified with the second button. Adding 'float: left' got it to do what I want: div style='float: left; text-align: right;' Want this right justified above Download button br / input type=submit class=submit name=submit_preview value=Generate Report /input input type=submit class=submit name=submit_download value=Download Table /input /div But the buttons /aren't/ left-justified, Larry, nor can they be, since the text is wider than the combined width of the buttons. /Perhaps/ what you want is the text left justified, and the right edge of the second button vertically aligned with the right end of the text ? However it had an odd, undesirable side effect. This was just a snippet of the page. This is contained within another div with a bottom border. Without the float: left the text and buttons display above the border as I want it to be and would expect it to be. But when I add the float: left the text displays on top of the border with the buttons below it. See: http://jsfiddle.net/w7BNW/4/ Remove the float: left to see what I mean. Why does the float: left cause this? How can I prevent that from happening? Use a mechanism other than floating the DIV to force it to be no wider than the text : div id='query' div style='display: inline-block; text-align: right'Want this right justified above Download button br / input type=submit class=submit name=submit_preview value=Generate Report / input type=submit class=submit name=submit_download value=Download Table / /div /div The text I used was an example (albeit a bad one). The actual text is not wider then the buttons. In any case, using display: inline-block got me what I want. Thank you so much! __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] aligning text to bottom of element
corey deep wrote: I am required to align text bottom right beside an image the image is of variable width height maximum 130px w or 130px height. the text remains at the same position relative to the image... Sounds like what this turns out as in most browsers... http://www.gunlaug.no/tos/alien/cd/test_08_0602.html ...but I won't guarantee it'll survive well everywhere and under all conditions. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] aligning text to bottom of element
thanks so much. I think this should work. On Mon, Jun 2, 2008 at 12:39 PM, Gunlaug Sørtun [EMAIL PROTECTED] wrote: corey deep wrote: I am required to align text bottom right beside an image the image is of variable width height maximum 130px w or 130px height. the text remains at the same position relative to the image... Sounds like what this turns out as in most browsers... http://www.gunlaug.no/tos/alien/cd/test_08_0602.html ...but I won't guarantee it'll survive well everywhere and under all conditions. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text field
Why don't you put the text fields in a box and the text in another box and float them next to each other at a certain distance? Riva Mário Gamito wrote: Hi, How can i in this page: http://www.gamito.org/wizard.php left align the text fields (dotted) at left in a certain distance from the text at its left ? Any help would be appreciated. Warm regards, Mário Gamito __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text with a background box
Ann Adamcik wrote:
One more...
I have a css button that I would like to have bottom aligned
with the text that it sits next to. Currently, the background
box sits below the text line and I can't seem to nudge it
upwards. Any ideas on lining it up properly?
See the 'go' button toward the bottom of this page:
http://procarta.com/beta2/story.php
The css is here: http://procarta.com/beta2/css/text_styles.css
Since you're working with pixels:
.go {
margin-left: 10px;
position:relative;
top:-7px;
}
You may want to reconsider font-sizes in pixels though. It leaves
IE5/6 users without options to resize the text in their browsers.
--
Els
http://locusmeus.com/
http://locusoptimus.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text with a background box
Els wrote:
Since you're working with pixels:
.go {
margin-left: 10px;
position:relative;
top:-7px;
}
You may want to reconsider font-sizes in pixels though. It leaves
IE5/6 users without options to resize the text in their browsers.
Thanks again - you're my hero today! Unfortunately, the client wants
pixel fonts. They originally wanted all the text rendered, so this is a
step up...
-Ann
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
Lst Recv wrote: Georg sent me this private reply. For the benefit of the list, I asked his permission to repost it to the list. (BEGIN:) Opera _can_ float elements at the same level as non-floating elements - even when a non-floating element comes first in the source-code. Other browsers will drop the float below the non-floating element in such cases. Nothing wrong the behavior for any of the browsers, but Opera's way is actually a bit unusual. A clarification of this: Opera is wrong here. A float should not appear any further up the page than the non-floating stuff that precedes it. Since the second item is further down the page when it is unfloated, it makes sense that when you float it right it just moves to the right, doesn't move up to be on the same line as the previous element. If you want them to be on the same line without floating the first one left, you would need to switch their order -- the right floated one would come first, then the non-floated one. Also, earlier in the thread it was suggested that you remove the display: block declaration from your floats and use display: inline instead. This is not necessary. Floats are by their very nature block, and telling them to be inline doesn't change anything -- except for IE, where it can sometimes fix bugs. However, I wouldn't put inline on them unless you need to -- keep it simple until IE forces you to do otherwise. In general, you never need to declare a display value for floats. Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
Georg, Thanks for the tips. I'm more concerned with using this as a learning case then just making this page look right. So, could I ask you to explain what are your tips are doing and why? Also, could anyone explain why some browsers decide to push the logo down a line when I don't float the man on the left (while Opera keeps it all together)? Thanks. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
Georg sent me this private reply. For the benefit of the list, I
asked his permission to repost it to the list.
(BEGIN:)
Opera _can_ float elements at the same level as non-floating elements -
even when a non-floating element comes first in the source-code. Other
browsers will drop the float below the non-floating element in such
cases. Nothing wrong the behavior for any of the browsers, but Opera's
way is actually a bit unusual.
Right now, it looks great in Firefox and Opera. IE is still
doing two funny things:
1) Adding a giant chunk of whiteness, where the background image
is not showing.
Add: #top {width: 100%;}
It is explained in details here...
http://www.satzansatz.de/cssd/onhavinglayout.html
...but the short answer is that giving the element defined dimensions
will trigger an exclusive IE/win bug - give the element 'Layout'. That's
why we often call it a 'hasLayout' trigger. The well known 'Holly Hack'
does exactly the same, but isn't needed in this case since no browsers
are misinterpreting a width-value when there's nothing else at the sides
and _no_ margins, paddings or borders.
2) Shifting the man's head over a few pixels, so that it doesn't
line up right.
Correct it for IE/win only: @media screen { * html img#dude
{margin: 0 0 0 -3px;} }
Minor detail, but will also advice you to put img
src=top_logo.jpg... / before img id=dude src=top_left.jpg
... / (reverse the order), so the poor guy don't get his head
chopped off on narrow windows :-)
This has to do with how content get linearized on narrow
windows/screens. We can use 'min-width' to stay in some control on
normal screens, but it's a bit harder to master the really small screens.
Look at how Opera will linearize your page in 'small screen rendering'
(shift + F11), and you'll get a good idea of more that just one problem
the sequence and layout-method a web page should - ideally - be able to
handle. Quite a few millions mobile phones out there already, and many
use them for surfing.
More on the subject...
http://www.gunlaug.no/contents/wd_1_05.html
...and that is on my own site in case you're wondering :-)
http://mortgagephonequotes.com/mortgage.html
A more important detail: IE6 is in quirks mode, so you should
delete 'padding-right: 15%;' from #results. That padding doesn't
make sense in any browser anyway - regardless of mode, and it
messes up available width in IE/win. Box-model differences... The
'width: 55%;' does the job on its own, without any padding.
Complete explanation here...
http://www.w3.org/International/articles/serving-xhtml/
...and I'm one of those who almost always run IE6 in quirks mode.
Also on #result: change 'line-height: 1.4em;' to 'line-height:
1.4;' (no unit), to get the correct calculation on child-elements.
Difference is pretty visible on narrow windows - especially in
IE/win.
The big picture...
http://www.w3.org/TR/REC-CSS2/syndata.html#length-units
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
On a completely different topic, but regarding your CSS:
Anytime you have 0 as a numerical value in your rules you don't need
units of anykind. Only when you have something other than 0 do you
need to specify px, em, %, etc.
Also, you can use the value stated once when all numbers are equal as below.
For instance: {margin: 0; padding: 0;}
Also, if top/bottom and right/left pairs are the same number you can do this:
{margin: 5px 3px; padding: 1px 4px;}
In the above case, the first number is for top/bottom, and the second
for right/left.
Overall, just a shorter, more bandwidth-friendly way of writing the
code. I know it seems tiny, but in the course of a whole CSS document
multiplied by the pages in your site multiplied by the times each page
is served up . . . it can mean quicker page loading and better use of
the bandwidth you pay for.
Hope that helps some. I'm still learning the CSS stuff myself :-)
Chris
CSS:
body { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; }
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
On 25/11/05, Chris Akins [EMAIL PROTECTED] wrote: Overall, just a shorter, more bandwidth-friendly way of writing the code. I know it seems tiny, but in the course of a whole CSS document multiplied by the pages in your site multiplied by the times each page is served up The joy of CSS in an external file is that is can be cached - so a user only has to download it once, no matter how many pages on the site they visit. -- David Dorward http://dorward.me.ukhttp://blog.dorward.me.uk __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
Thanks, Holly, fixing the selector solved both bugs! I see what you mean about needing the actual, noncondensed URL. Could you - or anyone - explain, though, why the initial version - which mistakenly put a float:right on the logo image but no float:left on the picture of the man (dude) produced such odd behavior - different in Firefox, Opera, and IE? I understand why Opera floated the logo right - that's what I told it to do. But why did Firefox push it down a line? And why did IE add a white horizontal space? Right now, it looks great in Firefox and Opera. IE is still doing two funny things: 1) Adding a giant chunk of whiteness, where the background image is not showing. 2) Shifting the man's head over a few pixels, so that it doesn't line up right. I updated the file - the URL is http://mortgagephonequotes.com/mortgage.html - so if anyone can take a look with IE and help me out, I'll be most obliged. Speaking of floats, anyone see the parade...? PS I'd like to express my thanks to everyone on the list for their help. I've found CSS positioning to be extremely challenging, but I'm hoping that I'm getting it, step by step. On 11/23/05, Holly Bergevin [EMAIL PROTECTED] wrote: The first bug you might want to deal with is your incorrectly written selector __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
Lst Recv wrote: Is there anyway to have one line of text, with part of it aligned to the containers left and part of it to it's right? Floats don't seem to work here - I don't know widths in advance, and I don't want flow, just justification. You don't need to know widths to use floats. Even the MacIE problem can be worked around nowadays. Crude example of what I'd like: The Opera (Fri, July 13) The opera was very fun, I enjoyed it very much... Or does this require a table? Of course not! :-) You have a couple options, which are explained in this article: http://www.communitymx.com/abstract.cfm?cid=529B0 Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.edu __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
On Nov 23, 2005, at 1:36 PM, Lst Recv wrote: Is there anyway to have one line of text, with part of it aligned to the containers left and part of it to it's right? You might want to take a look at this ALA article (Scroll down to Splitting the Difference): http://www.alistapart.com/articles/practicalcss/ Link description: ...place two elements at opposite sides of the browser window. This might be a case where you have a small logo that you want at the top right corner of your page, and some navigational elements at the top left Hth, Cheers, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
Is there anyway to have one line of text, with part of it aligned to the containers left and part of it to it's right? Floats don't seem to work here - I don't know widths in advance, and I don't want flow, just justification. Crude example of what I'd like: The Opera (Fri, July 13) The opera was very fun, I enjoyed it very much... Tableless options are detailed by Big John and Holly: http://www.communitymx.com/content/article.cfm?cid=529B0 I don't know of a way to do it without specifying the width of at least one of the two (left/right) containers. Not without resorting to a table or a pseudo-table via display: table-cell. Larry __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
Thanks - I went through the article, but can't seem to apply it to my case. I have a div id=banner, with two images. I'd like one to show on the left and one on the right. (The div also has a repeat-x background image). I've tried several permutations - but none get it right. I also tried http://css-discuss.incutio.com/?page=AlignLeftAndRight , but it pushed the right image down to the next line. (Could anyone explain why this is?) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
a newbie guess:
ul
li class=catThe Opera/li
li class=date(Fri, July13)/li
li class=descrip/li
/ul
.cat {float: left}
.date {float:right}
.descrip {clear: both}
at least conceptually... i think...
On Nov 23, 2005, at 4:36 PM, Lst Recv wrote:
Is there anyway to have one line of text, with part of it aligned to
the containers left and part of it to it's right?
Floats don't seem to work here - I don't know widths in advance, and I
don't want flow, just justification.
Crude example of what I'd like:
The Opera (Fri, July 13)
The opera was very fun, I enjoyed it very much...
Or does this require a table?
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
Thanks for the links and info.
I was sent a private email asking for the page itself. Here it is,
condensed - let me know if you need more.
I'm STUMPED by two problems:
1) Why is the logo on the right being pushed down to the next line?
2) Why is a thin white line appearing between #top and #blue?
div id=top
img id=man src= alt= /
a href=# class=logoimg src= alt= class=logo/a
br style=clear: both; /
/div
div id=blueimg src= alt= //div
CSS:
body { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; }
#top { background-image: url(); }
#top .logo, #top a.logo, #top a.logo img.logo { margin: 0px 0px 0px
0px; padding: 0px 0px 0px 0px; border: none;}
#top img.man { display: block; width: 25%; float: left; }
#top a.logo { display: block; width: 25%; float: right; }
#blue { background-image: url();}
#top, #blue { background-repeat: repeat-x; }
Any help is appreciated... I'm just trying to climb that CSS mountain,
one step at a time...
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
Lst Recv wrote: I have a div id=banner, with two images. I'd like one to show on the left and one on the right. (The div also has a repeat-x background image). I've tried several permutations - but none get it right. I also tried http://css-discuss.incutio.com/?page=AlignLeftAndRight , but it pushed the right image down to the next line. (Could anyone explain why this is?) Please post the URL of the page so we can look at the details of the code. Otherwise, we're all just guessing (generally a waste of time). Larry __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
Hi there, How about a link to your page and css?? It would help :-) Thanks, Bill Scheider Thanks - I went through the article, but can't seem to apply it to my case. I have a div id=banner, with two images. I'd like one to show on the left and one on the right. (The div also has a repeat-x background image). I've tried several permutations - but none get it right. I also tried http://css-discuss.incutio.com/?page=AlignLeftAndRight , but it pushed the right image down to the next line. (Could anyone explain why this is?) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
#top img.man { display: block; width: 25%; float: left; }
#top a.logo { display: block; width: 25%; float: right; }
Shouldn't these be display:inline; ? block will never work for your
case. If you want two things to stay on the same line, you have to use
inline!
--
--
Christian Montoya
christianmontoya.com ... rdpdesign.com ... cssliquid.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
On 11/23/05, bill [EMAIL PROTECTED] wrote: Hi there, How about a link to your page and css?? It would help :-) Thanks, Bill Scheider By popular demand, here are the links: http://mortgagephonequotes.com/mortgage.html BUGS On Opera, it displays fine, but: 1) On Firefox and IE, the logo on the left is pushed down to a new line. Why??? 2) On IE, a few pixel horizontal blank line is added across the top. Why? Also, I would like to right align the phone numbers to the right of the blurbs __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
On 11/23/05, Christian Montoya [EMAIL PROTECTED] wrote:
#top img.man { display: block; width: 25%; float: left; }
#top a.logo { display: block; width: 25%; float: right; }
Shouldn't these be display:inline; ? block will never work for your
case. If you want two things to stay on the same line, you have to use
inline!
Thanks - I changed it, but it didn't solve any of the bugs...
--
--
Christian Montoya
christianmontoya.com ... rdpdesign.com ... cssliquid.com
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
Sorry, mail program messup on the previous try...
---
From: Lst Recv [EMAIL PROTECTED]
Thanks - I changed it, but it didn't solve any of the bugs...
Let's see.
The first bug you might want to deal with is your incorrectly written
selector
#top img.dude {
display: block;
width: 25%;
float: left;
}
You have the dude in your HTML as an ID, not a class. If you write the
selector as -
#top img#dude {/* styles */}
you might have a little more success than you have had to this point. This is
the kind of stuff we can check out when there are URLs provided.
Secondly, you may be having further browser compatibility problems because you
have them all in quirks mode due to an incomplete doctype on your page. See
the following [1] for information on this subject (page 2 has a list) as well
as a page from the W3C [2] for another list of them. Another thing we can check
when provided with a URL...
Hope that helps,
~holly
[1] http://www.communitymx.com/abstract.cfm?cid=E2F258C46D285FEE
[2] http://www.w3.org/QA/2002/04/valid-dtd-list.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text
You have markup like:
div id=generalresume_nameAngus D.F. MacKinnon/div
p id=generalresume_address23756 110B Avenuebr /
But your css is:
.generalresume_name {
.generalresume_address {
Either the css needs to be
#generalresume_name {
#generalresume_address {
Or you need to change the markup to class=generalresume_name
The .whatever is a class, #whatever is an id.
Also, and according to Topstyle [1], underscores in selectors aren't
supported by many browsers, altough they are valid according to the CSS2
specification [2].
In regards to this matter something similar has been discussed here
before [3].
1. www.bradsoft.com/topstyle/
2. www.w3.org/TR/CSS2/syndata.html#q4
3. http://archivist.incutio.com/viewlist/css-discuss/58773
--
[EMAIL PROTECTED]
www.adrianocastro.net
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text
In your style sheet you have specified 'generalresume_name' and 'generalresume_address' as classes (they have a '.' before the name) and not ID's. Replace the '.' with a '#' and it works. I'd recommend checking your ID's and classes in 'ifsmain.css' with your 'generalresume.php' page. -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Angus at InfoForce Services Sent: Wednesday, November 09, 2005 8:44 AM To: CSS-D Subject: [css-d] Aligning text Can anyone tell me why my name and contact information at the following will not center? HTML: http://infoforce-services.com/personal/generalresume.php CSS: http://infoforce-services.com/css/ifsmain.css Also, if someone wants to give a simple two column layout example for my date and text, I would greatly appreciate it. Thank you. Angus MacKinnon MacKinnon Crest Saying Latin - Audentes Fortuna Juvat English - Fortune Assists The Daring Web page http://www.infoforce-services.com Choroideremia Research Foundation Inc. 2nd Vice president http://www.choroideremia.org __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text
From: Angus
Can anyone tell me why my name and contact information at the
following will not center?
HTML: http://infoforce-services.com/personal/generalresume.php
CSS: http://infoforce-services.com/css/ifsmain.css
Angus,
You have markup like:
div id=generalresume_nameAngus D.F. MacKinnon/div
p id=generalresume_address23756 110B Avenuebr /
But your css is:
.generalresume_name {
.generalresume_address {
Either the css needs to be
#generalresume_name {
#generalresume_address {
Or you need to change the markup to class=generalresume_name
The .whatever is a class, #whatever is an id.
--
Peter Williams
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
