http://sacklerlefcourtcenter.com/01/principles.html
Hi ,
Help!
I can't figure out what I have done incorrectly. My list gets funky at screen size 500. You can see the page at the link above.
Here is my code. (I put in the colors so that I can see when I'm in that screen size. I remove colors once a particular screen size is all done and looking good.)
Thanks everyone.
Kim
@media screen and (max-width: 500px){
li span.text,
li.principleslist {
font-size: 10 px;
display: list-item;
float: left;
margin: 0px 0px 0px 8px;
padding-right: 0;
width: 100%;
text-indent: 1 px;
line-height: 1.0;
}
p.paragraph span.text {
font-style: normal;
}
p.paragraph.innertext {
float: left;
margin-top: 10px;
width: auto;
}
p.paragraph#paragraphphilsophy_3 {
margin-top: 0;
margin-bottom: 0;
}
p.paragraph#paragraph-theseprinciples-3 {
margin-top: 7px;
margin-bottom: 0;
}
p.paragraph.innertextextra {
float: left;
width: auto;
}
p.paragraph span.paragraph-text-2 {
background-color: #bf22bf;
}
ul.unorder-list.principle-list {
margin-top: 50px;
background-color: #FF8040;
list-style-position: inside;
}
Hi ,
Help!
I can't figure out what I have done incorrectly. My list gets funky at screen size 500. You can see the page at the link above.
Here is my code. (I put in the colors so that I can see when I'm in that screen size. I remove colors once a particular screen size is all done and looking good.)
Thanks everyone.
Kim
@media screen and (max-width: 500px){
li span.text,
li.principleslist {
font-size: 10 px;
display: list-item;
float: left;
margin: 0px 0px 0px 8px;
padding-right: 0;
width: 100%;
text-indent: 1 px;
line-height: 1.0;
}
p.paragraph span.text {
font-style: normal;
}
p.paragraph.innertext {
float: left;
margin-top: 10px;
width: auto;
}
p.paragraph#paragraphphilsophy_3 {
margin-top: 0;
margin-bottom: 0;
}
p.paragraph#paragraph-theseprinciples-3 {
margin-top: 7px;
margin-bottom: 0;
}
p.paragraph.innertextextra {
float: left;
width: auto;
}
p.paragraph span.paragraph-text-2 {
background-color: #bf22bf;
}
ul.unorder-list.principle-list {
margin-top: 50px;
background-color: #FF8040;
list-style-position: inside;
}
Hi Kim,
I guess you need to be more specific as I didn't see anything that I would call funky. I thought it looked pretty good.
I guess you need to be more specific as I didn't see anything that I would call funky. I thought it looked pretty good.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
It's easy to overlook something you're not looking for.
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
here is a screen shot.
This occurs at 500px.
This occurs at 500px.
Did you take a look at that element in RLM at that break point to see what you had set different? If you could share your rlm file that would be great.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
It's easy to overlook something you're not looking for.
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
Hi,
I just reset the settings for the list, didn't help. Here is the RLMP file.
Thanks again,
Kim
I just reset the settings for the list, didn't help. Here is the RLMP file.
Thanks again,
Kim
Attaching the .rlmp project file would be very helpful.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
I think the problem may lie in the principles.css file. Commenting out the link to that particular CSS file in the header seems to resolve the problem, but I fear that I know too little about CSS3 to be sure where in that file the problem lies.
Frank
Frank
At line 224 of the principles.css file there is styling for when the screen width is 500px, and line 229 ( display: list-item;) seems to insert the extra list markers.
Frank
Frank
thanks frank, that worked.
Scott, FYI, I have no idea why, but I tried to attach the file several times, and it didn't work . I got a message stating that I had to attach a file with the proper extension. of course my rlmp file did have the proper extension...
I also renamed the file, I thought perhaps the file name to the left of .rlmp was too long, but that didn't help either.
Scott, FYI, I have no idea why, but I tried to attach the file several times, and it didn't work . I got a message stating that I had to attach a file with the proper extension. of course my rlmp file did have the proper extension...
I also renamed the file, I thought perhaps the file name to the left of .rlmp was too long, but that didn't help either.
FYI
Just zip your rlmp file and attached it that way to your message.
Just zip your rlmp file and attached it that way to your message.
Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.